Comment lier un évènement click à un élément HTML créé de façon dynamique – jQuery
Si vous essayez de lier les éléments qui sont dynamiquement ajoutés au DOM en utilisant la méthode click() de jQuery, cela ne fonctionnera pas, car il ne lie l’événement click qu’aux éléments qui existent au moment du « binding ». Pour lier l’événement click à tous les éléments existants et futurs éléments, utilisez la méthode on() de jQuery. voir l’exemple suivant.
Code HTML:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Lier un évènement click à un élément HTML</title> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> // Mettez le code jQuery ici. </script> </head> <body> <p>Cliquez sur le bouton ci-dessous pour ajouter dynamiquement de nouveaux éléments. Vous pouvez l'enlever plus tard.</p> <button>+ Ajouter</button> <ul> <li>Lorem Ipsum</li> <li>Lorem Ipsum</li> <li>Lorem Ipsum</li> </ul> </body> </html>
Code jQuery:
$(document).ready(function() { //Ajouter l'élément $("button").click(function() { $("ul").append("
Résultat |
---|
Cliquez sur le bouton ci-dessous pour ajouter dynamiquement de nouveaux éléments. Vous pouvez l'enlever plus tard.
|