jQuery 事件详解
- jQuery 事件注册
- jQuery 事件处理
- jQuery 事件对象
语法:
其他事件和原生基本一致。
比如mouseover、mouseout、blur、focus、change、keydown、keyup、resize、scroll 等
on() 方法在匹配元素上绑定一个或多个事件的事件处理函数
语法:
1. events:一个或多个用空格分隔的事件类型,如\”click\”或\”keydown\” 。
2. selector: 元素的子元素选择器 。
3. fn:回调函数 即绑定在元素身上的侦听函数。
on() 方法优势1:
可以绑定多个事件,多个处理事件处理程序。
on() 方法优势2:
可以事件委派操作 。事件委派的定义就是,把原来加给子元素身上的事件绑定在父元素身上,就是把事件委派给父元素。
在此之前有bind(), live() delegate()等方法来处理事件绑定或者事件委派,最新版本的请用on替代他们。
on() 方法优势3:
动态创建的元素,click() 没有办法绑定事件, on() 可以给动态生成的元素绑定事件
off() 方法可以移除通过 on() 方法添加的事件处理程序。
如果有的事件只想触发一次, 可以使用 one() 来绑定事件。
有些事件希望自动触发, 比如轮播图自动播放功能跟点击右侧按钮一致。可以利用定时器自动触发右侧按钮点击事件,不必鼠标点击触发。
有些事件希望自动触发, 比如轮播图自动播放功能跟点击右侧按钮一致。可以利用定时器自动触发右侧按钮点击事件,不必鼠标点击触发。
triggerHandler模式不会触发元素的默认行为,这是和前面两种的区别。
事件被触发,就会有事件对象的产生。
阻止默认行为:event.preventDefault() 或者 return false
阻止冒泡: event.stopPropagation()
jQuery中模拟用户操作
有时为了节省不想手动操作网页,但又想看到用户操作时的效果,可以用到jQuery提供的trigger方法。见下图代码
在不点击按钮时仍然想弹出this.value
我们只需要在后面加上.trigger(\”事件名称\”)就可以在不点击按钮的情形下看到用户点击按钮时看到的效果。这种方法的简写方法是用.事件名称代替trigger(\”事件名称\”),这种简写方法只适用于系统时间。
另外一种模拟方法是.triggerHandler,这种方法是基于.trigger的,只是增加了一些细节
他们之间的区别主要有4个:
1.trigger不会阻止默认行为,但triggerHandler会阻止默认行为
2.trigger会对所有的事件集合作用,而triggerHandler只对第一个作用
3.trigger是返回当前包含事件触发元素的jQuery对象可以连缀使用,而triggerHandler方法则返回当前事件执行的返回值,如果返回值不存在,则返回undefined
4.trigger在自定义事件中会冒泡,利于jQuery扩展于DOM的机制,但triggerHandler则不会。
posted on 2016-06-29 21:08 QiScript阅读(…) 评论(…)编辑收藏
本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com
文章为作者独立观点不代本网立场,未经允许不得转载。