如何給后添加的標簽添加事件
一、總結
一句話總結：
給新添加的元素hidden_panel類添加點擊事件：$("body").on("click", ".hidden_panel", function (e) { 執行的代碼 });
<script> $(function () { $("body").on("click", ".hidden_panel", function (e) { $(this).children(".panel-body").toggle(); $(this).children(".panel-footer").toggle(); $(this).find(".panel-heading_symbol_left").toggle(); $(this).find(".panel-heading_symbol_down").toggle(); }); }); </script>
二、給動態添加的標簽添加事件的問題
轉自或參考：給動態添加的標簽添加事件的問題 - tangmin的博客 - CSDN博客
https://blog.csdn.net/tangminfx/article/details/82019340
1 測試代碼： 2 3 <!DOCTYPE html> 4 <html> 5 <head> 6 <meta charset="UTF-8"> 7 <title>www.jb51.net - JS實現為動態創建的元素添加事件</title> 8 <script src="js/jquery-1.9.1.min.js"></script> 9 </head> 10 <body> 11 <button id="btn">添加事件</button> 12 <div id="panel"></div> 13 <script> 14 15 //jquery部分實現 16 $("#btn").click(function(){ 17 var arr= []; 18 for(var i=0;i<10;i++){ 19 arr.push("<p id='nep'>"+i+"</p>"); 20 } 21 $("#panel").html(function(){ 22 return arr.join("<br/>"); 23 }); 24 }); 25 //為動態創建的html標簽元素添加事件 26 $("#panel").on("click",function(){ 27 var that=$(this);//獲取當前點擊的this對象 28 alert(that.text()) 29 console.log(that.text()); 30 }); 31 </script> 32 </body> 33 </html>
三、JQuery實現動態添加的標簽元素的點擊事件
轉自或參考：JQuery實現動態添加的標簽元素的點擊事件
https://blog.csdn.net/doctor_ly/article/details/80253677
這里所說的動態添加的元素的意思是：用js添加的標簽元素
想對一些數據實現分頁，就自己寫一個分頁功能。用的是bootstrap的分頁，在頁面獲取數據列表后，計算出需要分多少頁展示，然后用js生成多個頁碼（是叫頁碼嗎？）。生成后，點擊某個頁碼跳到相應的頁，這時肯定要有點擊事件。問題來了，沒有點擊事件。（最初一臉黑人問號）
這是因為在注冊click后，再用js生成元素標簽的。所以后添加的元素標簽沒有注冊click事件。
網上還有一種普遍的解決方案：
用on去注冊事件，這種要有一個父級標簽，並且這個父級標簽不是用js生成的。
這樣雖然元素標簽在事件的注冊之后，但是點擊事件是注冊在父級標簽上的，我們還是可以觸發對應的事件。