2009-08-04 21 views
0

Ich versuche, alle Seiten meiner Website Methode mit jQuery .load so zu laden, das ist, wie meine Website aussieht:JQuery AJAX laden Problem

<script type="text/javascript"> 
    $(function() { 
    $('.link').bind('click', function(e) { 
      var page = $(this).attr('href'); 
      $('#site').addClass('loading'); 
      $('#content').load(page, function(){ 
      $('#site').removeClass('loading'); 
    }); 

    e.preventDefault(); 
    return false; 
    }); 

<a href="test.php" class="link">Test</a> 

Mit diesem Code, jede Verbindung, die class = "link" bekommt lädt meine Seite auf den div # content. Funktioniert gut! Keine Probleme, aber wenn ich die test.php lade, wenn ich den class = "link" auf irgendeinem Link, oder Button oder was auch immer benutze, funktioniert es einfach nicht und die neue Seite wird außerhalb meines #contents geladen.

Bereits versucht, dies in die neu geladene Datei zu kopieren, und es funktioniert nicht, hat jemand einen Hinweis? Diese

Dank

Antwort

2

liegt daran, wenn Sie ein Ereignis binden nur sie es an die Elemente binden, die zu dieser Zeit in dem DOM ist. Wenn Sie also später neue hinzufügen, sind sie nicht an das zuvor angefügte Ereignis gebunden. Angenommen, Sie haben jQuery 1.3, hat es eine integrierte Funktion um diese zu umgehen namens live. Damit können Sie ein Ereignis an alle aktuellen und zukünftigen Elemente binden. Es unterstützt nicht alle Ereignisse, aber click es unterstützt.

So halten, dass dies daran, Sie müssen nur ersetzen: Diese

$('.link').bind('click', function(e) { 

mit:.

$('a.link').live('click', function(e) { 

(ich die eine zu dem Wähler, weil es viel effizienter ist Gib das Tag an, wenn es überhaupt möglich ist.

Wenn du jQuery 1.3 nicht hast, solltest du so schnell wie möglich upgraden. Wenn Sie nicht können, überprüfen Sie das livequery Plugin, das das gleiche erreicht, aber auf eine viel weniger elegante Weise. Alternativ können Sie einfach eine Funktion haben, um die Aktion zu binden und sie jedes Mal aufzurufen, wenn Sie neue Daten laden. Alles in allem ist jQuerys live der beste Weg, dies zu tun.

+0

Ich schrieb auch ein Plugin namens Bond, das funktioniert wie Live, wenn Sie "Fokus" und "Unschärfe" Live-Funktionalität benötigen. http://code.google.com/p/jquery-plugin-dev/source/browse/trunk/jquery.bond.js – Tres

+0

Sieht gut aus, aber es funktioniert nicht mit Tasten, und ich muss POST-Daten senden mit meine neue test.php Seite, irgendein anderer Hinweis? Danke –