jQuery 之動態添加事件（on）

jQuery 之動態添加事件（on）

jQuery中，我們動態事件可以用on()函數。為當前頁面動態添加事件的語法如下：

$(selector).on(event,childSelector,data,function)

 例如，向p元素添加click的方法如下。

$(document).ready(function() {
    $("p").on("click",
    function() {
        alert("段落被點擊了。");
    });
});

 1     on的定義

• on() 方法在被選元素及子元素上添加一個或多個事件處理程序。
• on（）方法添加的事件處理程序可以用於當前及未來的元素。
• 要移除處理程序，請使用off（）方法。
• 如果只使用一次事件，然后移除，則可以使用one（）方法。
• 自 jQuery 版本 1.7 起，推薦使用on()方法代替bind()、live() 和 delegate()，因為它簡化了jQuery代碼庫。

2     語法

$(selector).on(event, childSelector, data, function)

參數	描述
event	必需。規定要從被選元素添加的一個或多個事件或命名空間。 由空格分隔多個事件值，也可以是數組。必須是有效的事件。
childSelector	可選。規定只能添加到指定的子元素上的事件處理程序（且不是選擇器本身，比如已廢棄的 delegate() 方法）。
data	可選。規定傳遞到函數的額外數據。
function	可選。規定當事件發生時運行的函數。

3     擴展問題

• 什么是為未來的元素添加事件處理程序？

• off()方法移除on()添加的事件

• one()事件只執行一次

參考網址

jQuery on()的使用方法：https://www.runoob.com/jquery/event-on.html