2010-11-23 18 views
0

Ich benutze ein Plugin namens Cloud Zoom. Das Problem ist, dass es sich an alles mit class="cloud-zoom" anschliesst, wenn das DOM bereit ist. Mein Problem ist, dass ich diese Klasse zum Zeitpunkt des Renderns nicht an DOM-Elemente anschließe. Es wird dynamisch angehängt. Also muss ich irgendwie .live mit ihm() mischen, damit es funktioniert:Wie füge ich jQuery .live() an diesen Codeschnipsel an?

$(document).ready(function() { 
    $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom(); 
}); 

.live() ein Ereignis erwartet. Ich bin mir nicht sicher, wie man ein Ereignis namens invoke CloudZoom() für jedes Element spezifiziert, das mit dem Klassen-Cloud-Zoom in das DOM injiziert wird.

Antwort

5

Sie können .live() hier nicht verwenden, es funktioniert in einer anderen ereignisgesteuerten spezifischen Weise. Für Plugins auf dynamische Elemente gibt es 2 Möglichkeiten, entweder wieder diesen Code ausführen, wenn neue Elemente in kommen, zum Beispiel in der Ajax-success Handler oder the .livequery() plugin verwendet wird, wie folgt aus:

$(document).ready(function() { 
    $('.cloud-zoom, .cloud-zoom-gallery').livequery(function() { 
     $(this).CloudZoom(); 
    }); 
}); 
+0

Danke Nick, ich werde das versuchen und zurück posten. Ich benutze XHR hier nicht. Meine Bilder sind verfügbar, nachdem das DOM geladen wurde. Das Problem ist nur eins nach dem anderen in der Div, wo die Klasse Cloud-Zoom ist. Wenn ich mit dem Mauszeiger über ein Minibild gehe, erscheint es auf der Registerkarte "Hauptbild" und ich muss dies anwenden. – randombits

+0

BTW, ich bekomme eine Menge davon in der Konsole, wenn ich dies versuche: Erwarteter Bezeichner für Klassenselektor aber gefunden 'Eltern'. – randombits

+0

@randombits - aus dem Plugin? –

0

denke ich, es so etwas wie sein könnte:

$(document).ready(function() { 
    $('.cloud-zoom, .cloud-zoom-gallery').live(function(){ 
     $(this).CloudZoom(); 
    });  
}); 

Ok, macht nichts, es erwartet Sie ein Event. Ich dachte über jQuery Livequery Plugin, die anonyme Funktion ohne Ereignis akzeptiert

+0

'.live()' funktioniert nicht so, es ist ereignisgesteuert. –

+0

Das wird nicht funktionieren. – Gidon

+0

Ja, ich habe über eine Live-Abfrage nachgedacht, wie es in deiner Antwort steht. – Flipke

0

Sie können dies versuchen, wenn die oben funktioniert nicht:

$(document).ready(function() { 
$('.cloud-zoom, .cloud-zoom-gallery').live(function(){ 
    $(this).CloudZoom(); 
}).trigger('click');  

});

Fügen Sie einfach den Auslöser klicken am Ende, funktioniert für mich.

Verwandte Themen