utiliser jquery sur un DOM qui a été ajouté après coup avec jquery ?

Question

Voici le cas. avec l'appel jquery ajax j'ai ajouté un nouveau lien < a id="new_link >

et je veux utiliser jquery sur ce lien nouvellement ajouté :

    $(document).ready(function(){

    $.post("static/js/jquery_call.php", function(data){
        $("#div_id").html(data);
    });

    $("#new_link").click(function(){

    ..... (and so on)

mais cela ne me permet pas car ce lien a été ajouté après que le DOM ait été généré. Je peux manipuler tous les autres liens mais pas celui qui a été ajouté récemment. Comment puis-je résoudre ce problème ?

Answer 1

Cette question est posée tous les deux jours. J'en ai profité.

$("#new_link").live('click',function(){});

Answer 2

Votre function(data) Le gestionnaire est invoqué lorsque la demande ajax est terminé (toutes les données sont présentes). Pendant ce temps, l'exécution du script continue. Ce qui signifie que votre $("#new_link")... Le code est très probablement exécuté avant que les données aient été ajoutées au domaine.
Soit vous utilisez un manipulateur en direct ou au moins déplacer votre code $("#new_link") à l'intérieur de la fonction(data) { } handler.

edit : exemple de code

$(document).ready( function(){
  $.post("static/js/jquery_call.php", function(data){
    $("#div_id").html(data).find("#new_link").click( function() {
      alert("Test");
    });
  });
});

Answer 3

Utilisez le .live() fonction ( doc ici ) pour se lier aux éléments existants et nouvellement créés :

$("#new_link").live("click", function(){
  // your code here
}