jQuery $(document).ready und UpdatePanels?

Question

Ich verwende jQuery, um einige Mouseover-Effekte auf Elemente zu verdrahten, die innerhalb eines UpdatePanel sind. Die Ereignisse sind gebunden in $(document).ready . Zum Beispiel:

$(function() {    
    $('div._Foo').bind("mouseover", function(e) {
        // Do something exciting
    });    
});

Natürlich funktioniert dies beim ersten Laden der Seite, aber wenn das UpdatePanel eine teilweise Aktualisierung der Seite vornimmt, wird es nicht ausgeführt und die Mouseover-Effekte funktionieren nicht mehr im UpdatePanel.

Was ist der empfohlene Ansatz für die Verdrahtung von Sachen in jQuery nicht nur auf die erste Seite laden, aber jedes Mal ein UpdatePanel eine teilweise Seitenaktualisierung auslöst? Sollte ich die ASP.NET ajax Lebenszyklus anstelle von $(document).ready ?

Answer 1

Meine Antwort?

function pageLoad() {

  $(document).ready(function(){

usw.

Es hat wunderbar funktioniert, wo eine Reihe anderer Lösungen kläglich versagt haben.

Answer 2

Ich würde einen der folgenden Ansätze wählen:

1. Kapseln Sie die Ereignisbindung in einer Funktion und führen Sie sie bei jeder Aktualisierung der Seite aus. Sie können die Ereignisbindung immer auf bestimmte Elemente beschränken, um Ereignisse nicht mehrfach an dieselben Elemente zu binden.

2. Verwenden Sie die live abfragen Plug-in, das im Grunde die erste Methode automatisch für Sie durchführt. Ihre Präferenz kann variieren, je nachdem, wie viel Kontrolle Sie über die Ereignisbindung haben möchten.

Answer 3

Die Verwendung der Funktion pageLoad() ist in dieser Situation sehr gefährlich. Sie könnten Ereignisse mehrfach verdrahtet werden. Ich würde auch bleiben weg von .live(), wie es an das Dokument-Element anhängt und hat die gesamte Seite (langsam und beschissen) zu durchlaufen.

Die beste Lösung, die ich bisher gesehen habe, ist die Verwendung von jQuery .delegate() Funktion auf einem Wrapper außerhalb des Update-Panels und die Verwendung von Bubbling. Andere dann, dass, Sie könnte immer Draht die Handler mit Microsofts Ajax-Bibliothek, die entworfen wurde, um mit UpdatePanels arbeiten.

Answer 4

Cuando $(document).ready(function (){...}) nicht funktionieren, nachdem die Seite zurückgeschickt wurde, verwenden Sie die JavaScript-Funktion pageLoad in Asp.page wie folgt:

<script type="text/javascript" language="javascript">
function pageLoad() {
// Initialization code here, meant to run once. 
}
</script>

Answer 5

FWIW, ich hatte ein ähnliches Problem mit Mootools. Re-attaching meine Ereignisse war der richtige Schritt, aber musste am Ende der Anfrage getan werden z.B.

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function() {... 

Nur etwas zu beachten, wenn beginRequest Ursachen Sie Null-Referenz JS Ausnahmen zu erhalten.

Prost