在前端頁面的時候，會經常遇到用JavaScript動態創建出來的Button按鈕或其他標簽無法使用點擊事件的問題。如下代碼，使用jquery在body中動態創建一個class為demo的Button按鈕，當點擊這個按鈕時無法觸發點擊事件。
<script> $(function(){ $("body").html("<button class='demo'>按鈕</button>"); $(".demo").click(function(){ alert("彈窗"); }); }); </script> <body> </body>
將以上代碼中的 $(“.demo”).click(function(){………}); 修改為 $(document).on(“click”,”.demo”,function(){………})即可：
<script> $(function(){ $("body").html("<button class='demo'>按鈕</button>"); $(document).on("click",".demo",function(){ alert("彈窗"); }); }); </script> <body> </body>
此時事件冒泡到document對象上，當檢測事件的target，如果與傳入的選擇符（這里是selector）匹配，就觸發事件，否則不觸發。
.on()方法的 [.selector]用法詳情見：https://www.runoob.com/jquery/event-on.html