JavaScript JQuery auf geladenen Inhalt

[Aradiv]

Ich lade mit load bzw. append Daten in ein Div und möchte nun nach dem Laden die jquery Funktionen auch auf den Inhalt anwenden können.

Das ist der Code den ich momentan benutze

$(document).ready(function(){
    $("a").click(function(){
    $("#content").empty();
    $("#content").load("test.php");
  });
}

beim Aufruf eines Links auf der Hauptseite funktioniert alles. Aber wenn ich einen Link der in test.php steht aufrufe funktioniert es nichtmehr.

jemand eine Idee wie ich das lösen kann?

mfg
Aradiv

 

[Robbi5]

.live() ist die Lösung, da somit deine Funktion auch an zukünftige Elemente gebunden wird

$(function(){
  $("a").live('click',function(){
      $("#content").empty().load("test.php");
  });
});

 

[tleilax]

Die .live()-Eventhandler können im Übrigen auch ausserhalb des "document ready"-Handlers definiert werden. Bringt bei kleineren Seiten nicht viel, aber bei größeren Seiten dürfte sich der Unterschied schon bemerkbar machen.

 

[Aradiv]

Danke euch beiden ;-)

mfg
Aradiv

 

[paddya]

Die .live()-Eventhandler können im Übrigen auch ausserhalb des "document ready"-Handlers definiert werden. Bringt bei kleineren Seiten nicht viel, aber bei größeren Seiten dürfte sich der Unterschied schon bemerkbar machen.

Gut, dass du das ansprichst. Den Selektor-Overhead kann man sich seit 1.4.1 aber auch sparen, da es die neuen Funktionen .delegate() und .undelegate() gibt.

$('a').live('click', function() {});

// schneller
$(document).delegate('click', 'a', function() {});

// noch besser, falls die Links nur im Content-Bereich vorhanden sind.
$('#content').delegate('click', 'a', function() {});