JqueryOn繫結事件方法介紹

2022-06-24 16:33:10 字數 735 閱讀 9734

1. 簡介

(1) on()方法在被選及子元素上新增乙個或多個事件處理程式

(2) 在jquery 版本1.7起,on()方法是bind(),live()和delegate()方法的新的替代品,該方法給api帶來很多便利,簡化了jquery**庫。

(3) 使用on()方法新增的事件處理程式適用於當前及未來的元素(比如由指令碼建立的新元素)

2. 目前了解到使用場景

(1) 使用ajax請求資料時使用。

(2) 對載入完頁面之後的元素進行事件繫結。

3. 注意事項

(1) 你使用jquery追加的元素要在乙個不會進行改變的父級之下,可以是document。

(2) 繫結有兩種方式

① 單個事件繫結

1) $(「#id」).on(『click』,function(){})    把點選事件繫結到id為id的元素身上

2) $(「#id」).on(『click』,』.div』,function(){})  把點選事件繫結到id為id的子級元素類名為div的元素身上

② 多事件同時繫結到乙個元素上

③ $(「.div」).on(,

mouseout:function(),

click:function()

4. 案例

測試 測試_測試 

測試1 

測試_測試1 

測試 測試-測試-測試 

測試1

測試-測試buttona

Jquery on 動態繫結事件

之前就一直受這個問題的困擾,在jquery1.7版本之後新增了on方法,之前就了解過,其優越性高於live bind delegate 等方法,在此之前專案中想用這個來測試結果發現,居然動態生成的標籤點選了沒反應,而live方法卻能夠支援 jquery 使用on繫結動態生成的元素時,不能直接用該物件...

jquery on實現繫結多個事件

on events,selector data fn 概述 在選擇元素上繫結乙個或多個事件的事件處理函式。on 方法繫結事件處理程式到當前選定的jquery物件中的元素。在jquery 1.7中,on 方法 提供繫結事件處理程式所需的所有功能。幫助從舊的jquery事件方法轉換,see bind d...

jquery on 事件委託

功能 在選擇元素上繫結乙個或多個事件的事件處理函式 on函式原型 on events,selector data fn 引數說明 events 乙個或多個用空格分隔的事件型別和可選的命名空間,如 click 或 keydown.myplugin selector 乙個選擇器字串用於過濾器的觸發事件的...