jQuery charger les meilleures pratiques

Question

J'ai une question sur les meilleures pratiques de charge de jQuery. Imaginez la situation suivante:

$("#div").on('click', function() { 
$('#result').load('test.html'); 
}); 

Le code fonctionne très bien, la méthode de charge exécute, mais maintenant le contenu chargé ne peut pas être accessible par un plugin jQuery. J'ai résolu comme ceci:

$("#div").on('click', function() { 
$('#result').load('test.html', function(){ 
$('.element').plugin(); 
}); 
}); 

Ma question est simple, existe-t-il une meilleure façon de résoudre cette situation?

Answer 1

Idéalement vous devez cibler le parent de l'élément avec id="div" ... disons un récipient <div id="wrap"> pour cet exemple. Ensuite, utilisez .on() en utilisant le conteneur parent comme sélecteur comme:

$("#wrap").on("click", "#div", function() { 
$('#result').load('test.html'); 
}); 

alors le contenu chargé est accessible par votre autre plug-in. Ce format d'utilisation de .on() a effectivement remplacé .live() depuis jQuery v1.7.x.

Finalement, vous pouvez également faire

$("body").on("click", "#div", function() { 
$('#result').load('test.html'); 
}); 

Answer 2

Vous le faites de la bonne façon. votre code pour appeler la méthode plugin ne s'exécutera qu'après que le chargement aura fini de se charger dans la div. Donc, vous êtes bon à faire.

Vous pouvez probablement placer tout votre code dans le document.ready pour vous assurer qu'il ne sera exécuté qu'après le chargement de dom.

$(function(){ 
    $("#div").on('click', function() { 
     $('#result').load('test.html', function(){ 
      $('.element').plugin(); 
     }); 
     });  
});