Heim > Web-Frontend > js-Tutorial > So gehen Sie damit um, dass jQuery beim Hinzufügen von Elementen keine Bindungsereignisse auslöst

So gehen Sie damit um, dass jQuery beim Hinzufügen von Elementen keine Bindungsereignisse auslöst

php中世界最好的语言
Freigeben: 2018-03-15 11:38:39
Original
1746 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie damit umgehen können, dass jQuery beim Hinzufügen von Elementen das Bindungsereignis nicht auslöst Das Bindungsereignis beim Hinzufügen von Elementen ist das Folgende ein praktischer Fall, schauen wir uns das an. Ich bin kürzlich auf ein Problem gestoßen. Nachdem ich JQuery zum dynamischen Hinzufügen von Elementen verwendet hatte, stellte ich fest, dass die dynamisch hinzugefügten Elemente keine Ereignisse auslösen konnten. Später habe ich einige Informationen im Internet überprüft und festgestellt, dass dies folgendermaßen gehandhabt werden sollte:

Lassen Sie mich zunächst den Code zeigen, der den Fehler verursacht hat:

Das werde ich tun Gib dir meine Lösung

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title></title>
  <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="external nofollow" >
  <script src="//cdn.bootcss.com/jquery/1.8.3/jquery.min.js"></script>
  <script>
    $(document).ready(function(){
//这里是动态添加元素
      $(".add").click(function(){
        var btn = $("<button class=&#39;newBtn btn btn-default&#39;>新按钮</button>");
        $("body").append(btn);
      })<br><br>//这里是为添加的元素添加事件
      $(".newBtn").click(function(){
        alert("这里是新添加的元素触发的事件");
      })
    })
  </script>
</head>
<body>
<button class=" add btn btn-default">添加按钮</button>
</body>
</html>
Nach dem Login kopieren

Methode 1: Live-Ereignisse binden (Live-Ereignisse werden nur unter JQuery 1.9 unterstützt, nicht höhere Versionen).

Methode 2: On()-Ereignisbindung verwenden
$(".newBtn").live("click",function(){
///jquery 1.9(不包括1.9)以下可以
  alert('这里是动态元素添加的事件');
})
Nach dem Login kopieren

($(ParentEle).on("click",".thisEle",function(){})

ok, Problem gelöst, weiter in die Grube klettern .
$("body").on("click", ".newBtn", function() {
   alert('这里是动态元素添加的事件');
});
//这里的ParentEle是 thisEle的父辈元素或者祖先元素,ParentEle可以是document,也可以是body等。
//注意:如果此时调用的函数是外部定义好的函数,那在调用的时候不要加(),不然会跳过点击事件直接触发函数
Nach dem Login kopieren
$("body").on("click", ".newBtn",aa );
function aa(){
    alert('这里是动态元素添加的事件');
}
Nach dem Login kopieren
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Was tun, wenn die Jquery-Triggerfunktion das A-Tag nicht auslösen kann


So verwenden Sie Jquer Um Tabellenzeilen und -spalten zu implementieren, tauschen Sie


jquerys Formularvalidierungsübermittlung


jQuerys Kontrollkästchenauswahl aus und erhalten Sie den Wert

Das obige ist der detaillierte Inhalt vonSo gehen Sie damit um, dass jQuery beim Hinzufügen von Elementen keine Bindungsereignisse auslöst. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage