Benannte Anker nicht die Arbeit mit dynamischen HTML und jquery

Question

Ich versuche, einen HTML-Schnipsel dynamisch hinzuzufügen, die benannte Anker und Ziele über jquery Append enthält (‚html‘) Methode

Keine der genannten Verbindungen nach dem Anfügen arbeiten. Der neu hinzugefügte Inhalt ist auf der Seite sichtbar, aber die Links funktionieren nicht. Liegt es daran, dass diese Tags dynamisch hinzugefügt wurden, oder mache ich hier etwas falsch? Alle serverseitig generierten benannten Anker funktionieren jedoch einwandfrei.

vereinfachte html:

<a href="#tab">Foo</a> 

<div id="tab"></div> 

("#testButton").click(function() { 
    $('#mainSegmentDiv').append("html") 
}); 

Answer 1

Anker mit JavaScript beigefügten sollte Arbeit als Anker (indem sie klicken sollte nehmen Sie an welchem ​​Ort in seiner href Attribut angegeben ist), aber wenn Sie versuchen, eine verwenden, Tag-Name, id oder class sie wählen, werden sie nicht ‚Arbeit‘, weil sie in dem DOM nicht vorhanden waren, als die Ereignishandler gebunden waren:

JS Fiddle demo (demonstrates non-working code).

Ohne spezifische Kenntnisse Ihrer HTML, oder was Sie tun, kann ich Ihnen nur diesen Vorschlag:

$('body').on('click','a',function(){ 
    // do something 
}); 

JS Fiddle demo (demonstrates working code).

Die on() Methode legt das click Ereignis (in diesem Fall) an das body Element und stützt sich auf Ereignispropagierung zu arbeiten, dass in der Klick auf die body sprudelt und dann klappt, wo es herkam und ob es passt die gegebenen Selektor (die a in diesem Fall können Sie id, class oder einen beliebigen gültigen jQuery-Selektor verwenden). Wenn es mit dem Selektor übereinstimmt, wird die Funktion der Ereignisse/Funktionen (in diesem Fall ist das der // do something Kommentar) ausgeführt.

Idealerweise würden Sie anstelle von $('body') das am nächsten liegende parent-Element zu den Elementen verwenden, die Sie später zum DOM hinzufügen, das zum Zeitpunkt der Ereignisbindung existiert (normalerweise $(document).ready()).

Referenzen:

• on().

Answer 2

Sie nicht $ seletor Zeichen worte. Beginign für Linie

$("#testButton").click(function() {