什么是事件委托?jquery和js怎么去实现?
事件委托又叫事件代理,事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。
js:
window.onload = function(){
var oul = document.getElementById("ul1");
oul.onclick = function(ev){
var ev = ev || window.event;
var target = ev.target || ev.srcElement;
if(target.nodeName.toLowerCase()=="li"){
console.log(target.innerHTML);
}
}
}
jquery:
$(function(){
$("#lists").on("click","li",function(event){
var target = $(event.target);
target.css("background","red");
})
})
什么是事件委托?jquery和js怎么去实现?的更多相关文章
- js事件委托 jQuery写法
http://www.cnblogs.com/liugang-vip/p/5616484.html 不是抄的,这篇文章写的细 这是js 事件委托写法 <!DOCTYPE html> < ...
- js事件委托篇(附js一般写法和js、jq事件委托写法)
参考: jQuery代码优化:事件委托篇 使用该技术能让你避免对特定的每个节点添加事件监听器:相反,事件监听器被添加在他们的父元素上,事件监听器会分析从子元素上冒泡上来的事件,并找到是哪个子元素事件. ...
- 事件委托能够优化js性能
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 事件委托&jQuery on
例如: <h2>Great Web resources</h2> <ul id="resources"> <li><a hre ...
- JS与Jquery的事件委托——解决了绑定相同事件的问题
概念: 什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完 ...
- JS与Jquery的事件委托
参考:http://www.ituring.com.cn/article/467 概念: 什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委 ...
- JS与Jquery的事件委托机制
传送:http://www.ituring.com.cn/article/467 概念: 什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委 ...
- 事件冒泡、事件委托、jQuery元素节点操作、滚轮事件与函数节流
一.事件冒泡定义 事件冒泡是指在一个对象触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那 ...
- Jquery事件委托之Safari
什么是事件委托 事件委托是Jquery中一种事件绑定的方式,不同于常见的事件绑定方式将事件绑定在目标元素上,而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数. //常见的事件绑定(Jquery) ...
随机推荐
- 栈 <stack> F - 宋飞正传
I’m out of stories. For years I’ve been writing stories, some rather silly, just to make simple prob ...
- php八大设计模式之适配器模式
将一个抽象被具体后的结果转换成另外一个需求所需的格式. 在生活中也处处有适配器的出现,比如转换头,就是让两种不同的规格合适的搭配在一起. <?php header("content-t ...
- Centos7(阿里云服务器)安装Anaconda的详细步骤与心得
在本地安装Anaconda的各个版本的文章已经很多,但是感觉不是很详细,因此,在此发发自己在Centos7(阿里云服务器)安装Anaconda的心得和步骤: 注:需要注意的地方会用不同颜色区别. 1. ...
- 今日SGU 6.6
sgu 177 题意:给你一个一开始全是白色的正方形,边长为n,然后问你经过几次染色之后,最后的矩形里面 还剩多少个白色的块 收获:矩形切割,我们可以这么做,离散处理,对于每次染黑的操作,看看后面有没 ...
- 洛谷 P1294 高手去散步
P1294 高手去散步 题目背景 高手最近谈恋爱了.不过是单相思.“即使是单相思,也是完整的爱情”,高手从未放弃对它的追求.今天,这个阳光明媚的早晨,太阳从西边缓缓升起.于是它找到高手,希望在晨读开始 ...
- HBase快照、Snapshots 淘宝快照
淘宝在2011年之前所有的后端持久化存储基本上与我们所认知的意义, 大量存于 mysql .少量 oracle mongdb 等,使用mysql 的原因相信各位也很熟悉了. 开源.社区庞大.解决方 ...
- myeclipse2013 jsp编辑初始化
首先,大家可能有过这种经历.双击打开jsp编辑.它默认会打开视图,这样就使人恼火了,卡死了.所以我们能够自己设jsp的默认打开方式:打开Window-->preferences得: 搜索edit ...
- [PostCss] Easily Load Google Fonts with PostCSS Font Magician
Configuring Google Fonts can be quite an annoying process to setup. Using Font Magician with PostCSS ...
- HDU Victor and World (最短路+状态压缩)
题目链接:传送门 题意: n个城市m条路.刚開始在点1,求把每一个城市都遍历一边最后回到1的花费的最小值. 分析: +n2∗2n). 转自Bestcode. 以下说说我的状态转移,首先 ...
- 怎样使用纯CSS3创建一个简单的五角星图形
我们能够使用SVG.Canvas.CSS3或者背景图片来实现五角星图案及其悬停效果. CSS3引入的伪元素和变换特性使得实现五角星图形很easy,而且能够结合渐变实现更为美丽的效果.因此使用图片实现五 ...