Jquery Ajax Fehler nach dem Laden in eine div - jquery, ajax

Angenommen, ich habe eine Seite mit dem Namen index.php, die einen div-Elementnamen divContent enthält, der eine Schaltfläche namens "msg" und eine weitere Schaltfläche namens "show" enthält.

Wenn ich index.php laden, zeigen zwei Knöpfe gut an. Ich habe jquery auf meiner Seite hinzugefügt. Wenn ich auf "msg" klicke, wird "msg" angezeigt

Alarm ("erfolgreich");

. Es funktioniert, wenn ich auf die Schaltfläche "show" (außerhalb des divContent) klicke, wird durch ajax-Technik ein anderer Seiteninhalt in meinen divContent geladen.

$("#msg").click(function(e) {
alert("successful");
});
} //Whilst editing formatting - extra closing brace

$("#show").click(function(e) {
$.ajax({
type: "GET",
url: "test.php",
success: function(msg){
$("#divContent").html(msg);
}
});
e.preventDefault();
});


test.php
--------
<input type="button" id="msg" />

Prüfung.php enthält eine Schaltfläche, die der msg-Schaltfläche in index.php entspricht. Mein Problem ist, wenn laden index.php, klicken Sie auf die msg-Schaltfläche zeigt es die erfolgreiche msg, aber wenn Sie auf show-Schaltfläche klicken lädt es test.php "s enthält in divContent und klicken Sie auf msg Schaltfläche zeigt es nicht" erfolgreich "Nachricht ist das Problem

Antworten:

es ist, weil Sie einen Klick an alle bindenDie vorhandenen #msg-Elemente funktionieren nicht mit Elementen, die zum Zeitpunkt der Bindung nicht vorhanden sind. Wenn Sie also neuen Inhalt laden, ist kein Klick an ihn gebunden. Sie müssen ihn erneut binden.

success: function(msg){
$("#divContent").html(msg);
$("#msg").click( .... );
}

ODER, verwenden Sie die .on () Methode:

Suchen Sie nach einem Element, das ein Vorgänger für beide #msg-Schaltflächen ist, und binden Sie ein Ereignis mithilfe von .on an dieses Ereignis

$(".parent").on("click", "#msg", function(){
alert("whatever");
});

Dadurch wird sichergestellt, dass jedes #msg, das ein Kind von .parent ist, unabhängig davon, wann es erstellt wurde, ein Klickereignis hat.

Quelle: http://api.jquery.com/on/

Ihre erste Klick-Funktion hat eine zusätzliche schließende Klammer.

$("#msg").click(function(e) {
alert("successful");
});
} //<<Here