jQuery laden Best Practice

Question

Ich habe eine Frage zu jQuery laden Best Practice. Stellen Sie sich folgende Situation:

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

Der Code funktioniert gut, führt die Lademethode, aber jetzt ist der geladene Inhalt nicht durch eine jQuery-Plugin zugegriffen werden kann. Ich löste so:

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

Meine Frage ist einfach, gibt es einen besseren Weg, um diese Situation zu lösen?

Answer 1

Im Idealfall müssen Sie das parent des Elements mit id="div" Ziel ... sagen wir mal einen Container <div id="wrap"> für dieses Beispiel. Dann .on() verwenden Sie die parent Behälter als Selektor wie:

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

dann der geladene Inhalt kann von Ihrem anderen Plugin zugegriffen werden.

Dieses Format der Verwendung von .on() ersetzt tatsächlich .live() seit jQuery v1.7.x.

Schließlich könnten Sie tun auch

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

Answer 2

Sie tun es in der richtigen Weise. Ihr Code zum Aufrufen der Plugin-Methode wird erst ausgeführt, nachdem der Ladevorgang beendet ist. Du bist also gut zu gehen.

Wahrscheinlich können Sie Ihren gesamten Code in das Dokument einfügen. Stellen Sie sicher, dass dies erst nach dem Laden des Doms ausgeführt wird.

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