on指的是事件委托,舉個例子,
創(chuàng)新互聯(lián)基于分布式IDC數(shù)據(jù)中心構(gòu)建的平臺為眾多戶提供四川服務器托管 四川大帶寬租用 成都機柜租用 成都服務器租用。
$(document).on("click", ".ontest", function () {
//......
});
假設你的.ontest一開始不存在DOM結(jié)構(gòu)當中,也就是html里面,如果你直接click(function () {});的話,事件是無法成功綁定的,而用on委托給document的話,在事件冒泡的時候,就可以成功出發(fā)綁定的事件。
.on()方法事件處理程序到當前選定的jQuery對象中的元素。
.on( events [, selector ] [, data ], handler(eventObject) )
events:類型: String
一個或多個空格分隔的事件類型和可選的命名空間,或僅僅是命名空間,比如"click", "keydown.myPlugin", 或者 ".myPlugin"。
selector:類型: String
一個選擇器字符串,用于過濾出被選中的元素中能觸發(fā)事件的后代元素。如果選擇器是 null 或者忽略了該選擇器,那么被選中的元素總是能觸發(fā)事件。
data:類型: Anything
當一個事件被觸發(fā)時,要傳遞給事件處理函數(shù)的event.data。
handler(eventObject):類型: Function()
事件被觸發(fā)時,執(zhí)行的函數(shù)。若該函數(shù)只是要執(zhí)行return false的話,那么該參數(shù)位置可以直接簡寫成 false。
jQuery中用on來綁定事件,常用寫法
兩種寫法哪個更好?
1. $(document).on 將事件委托document, $('#idname').on 將事件綁定到.className元素上。每次document有點擊動作,瀏覽器都會判斷當前點擊的對象。如果匹配再決定要不要執(zhí)行,多了個判斷環(huán)節(jié)。JS渲染效率很高,所以此異同基本可以忽略。
2. $("className").on 為onclick綁定,只有在頁面onload時執(zhí)行一次。頁面刷新后,新加載的具有className的元素便沒有事件綁定到上面了。相反$(document).on這種方法會刷新和重新賦予綁定操作,所以一定程度上更為全面。
一、作用不同
1、on():在被選元素及子元素上添加一個或多個事件處理程序。
2、live():為被選元素附加一個或多個事件處理程序,并規(guī)定當這些事件發(fā)生時運行的函數(shù)。
二、觸發(fā)條件不同
1、on():使用 on() 方法添加的事件處理程序適用于當前及未來的元素(比如由腳本創(chuàng)建的新元素)。
2、live():通過 live() 方法附加的事件處理程序適用于匹配選擇器的當前及未來的元素(比如由腳本創(chuàng)建的新元素)。
三、語法不同
1、on():$(selector).on(event,childSelector,data,function)childSelector可選。規(guī)定只能添加到指定的子元素上的事件處理程序(且不是選擇器本身,比如已廢棄的 delegate() 方法)。
2、live():$(selector).live(event,data,function),其中event必需。規(guī)定附加到元素的一個或多個事件。由空格分隔多個事件。必須是有效的事件。
參考資料來源:百度百科-jQuery