JQ動態繫結
阿新 • • 發佈:2018-11-06
JQ中的on()方法
- 語法 : $(selector).on(event,childSelector,data,function)
event:必需。規定要從被選元素移除的一個或多個事件或名稱空間。
childSelector:可選。規定只能新增到指定的子元素上的事件處理程式(且不是選擇器本身,比如已廢棄的 delegate() 方法)。
data:可選。規定傳遞到函式的額外資料。
function:可選。規定當事件發生時執行的函式。
事例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div> <p>這是個事例</p> <p>這是個事例</p> <p>這是個事例</p> </div> <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> <script> $(function() { bindBtn(); }); var bindBtn = function() { $("body").on("click", "p", function() { $("<p>這是個事例</p>").appendTo("div"); }); } </script> </body> </html>
這種方法,對現存在的DOM元素節點或是動態建立的節點都有效果