JQuery7:事件委託
#事件委託
事件委託就是利用冒泡的原理,把事件加到父級上,通過判斷事件來源的子集,執行相應的操作,事件委託首先可以極大減少事件繫結次數,提高效能;其次可以讓新加入的子元素也可以擁有相同的操作。
###一般繫結事件的寫法
$(function(){
$ali = $('#list li');
$ali.click(function(event) {
$(this).css({background:'red'});
});
})
...
<ul id="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
###事件委託的寫法
$(function(){
$list = $('#list');
$list.delegate('li', 'click', function(event) {
$(this).css({background:'red'});
});
})
...
<ul id="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
###取消事件委託
// ev.delegateTarge 委託物件
$(ev.delegateTarge).undelegate();
// 上面的例子可使用 $list.undelegate();
學院Go語言視訊主頁
https://edu.csdn.net/lecturer/1928
清華團隊帶你實戰區塊鏈開發
掃碼獲取海量視訊及原始碼 QQ群:721929980
相關文章
- 事件委託事件
- 委託、事件--委託例項篇事件
- 委託與事件-委託詳解(一)事件
- jQuery 事件委託jQuery事件
- 事件模型和事件委託事件模型
- C# 事件委託C#事件
- C#事件委託事件
- 重中之重:委託與事件事件
- C# 委託事件C#事件
- wpf移除事件委託事件
- Js 事件原理與事件委託JS事件
- JS事件流和事件委託JS事件
- 委託、Lambda表示式、事件系列07,使用EventHandler委託事件
- C#委託與事件C#事件
- JavaScript 事件委託詳解JavaScript事件
- C# 事件 vs 委託C#事件
- C# - 委託與事件C#事件
- c# 委託和事件C#事件
- 委託與事件-事件詳解(二)事件
- 委託、Lambda表示式、事件系列01,委託是什麼,委託的基本用法,委託的Method和Target屬性事件
- 委託、Lambda表示式、事件系列05,Action委託與閉包事件
- js--事件流、事件委託、事件階段JS事件
- 委託、Lambda表示式、事件系列04,委託鏈是怎樣形成的, 多播委託, 呼叫委託鏈方法,委託鏈異常處理事件
- JavaScript 事件委託或者事件代理介紹JavaScript事件
- 事件的捕獲、冒泡、委託事件
- C# 之委託與事件C#事件
- javascript中的事件委託(代理)JavaScript事件
- jquery-中的事件委託jQuery事件
- Zepto事件委託的小坑事件
- js 事件的冒泡和委託JS事件
- 委託、Lambda表示式、事件系列03,從委託到Lamda表示式事件
- 事件委託---動態建立的元素新增事件事件
- 委託、Lambda表示式、事件系列02,什麼時候該用委託事件
- 事件委託詳解最新版事件
- 對js事件委託的瞭解JS事件
- jquery中如何使用事件委託?jQuery事件
- .NET委託,事件和Lambda表示式事件
- javascript事件委託程式碼例項JavaScript事件