jQuery学习笔记(四) 事件及特效
来源:互联网 发布:杭州 人工智能 医院 编辑:程序博客网 时间:2024/05/21 22:28
辛苦堆砌,转载请注明出处,谢谢!
1.事件注册及撤销
(1)事件注册
bind(eventType,function),bind(eventType,data,function),bind(map),bind(eventType,boolean)
上面四个函数用来注册事件,其中boolean参数的比较特殊,它可以用来阻止事件执行默认行为。这四个方法不会对之后新添加的DOM元素进行事件绑定。
one(eventType,function),one(eventType,data,function)
同bind,不同之处是事件处理函数只执行一次,之后自动撤销绑定。
on(events,selector,function),on(events,selector,data,function),on(map,selector,data)
on方法和bind作用基本类似,但是on方法通过传递的选择器参数(selector),可以自动的为之后新添加的匹配选择器的元素绑定事件。如下例:
$(".A").on("mouseenter", "img", function(e) {...});
$(".B").append($("<img src="a.png"/>"));
由于.B中新添加的img元素满足on中的选择器img,所以,会自动为.B中添加的img绑定事件。
delegate(selector,eventType,function),delegate(selector,eventType,data,function),delegate(selector,map)
delegate方法与on方法作用相同,不同之处在于delegate只会为调用delegate的元素集的中添加的新的符合选择器的元素自动绑定事件。
$(".A").delegate("mouseenter", "img", function(e) {...});
$(".B").append($("<img src="a.png"/>"));
$(".A").append($("<img src="a.png"/>"));
虽然.B中新添加的img元素满足on中的选择器img,但是由于.B没有调用delegate,不会为.B中添加的img绑定事件。但是.A中的可以。
(2)事件撤销
unbind(),unbind(eventType),unbind(eventType,boolean),unbind(Event)
用来撤销使用bind注册的事件。其中boolean参数的方法,用来恢复默认行为。
off(events,selector,function),off(map,selector)
用来撤销由on注册的事件,注意selector要与on中一致。
undelegate(),undelegate(selector,eventType)
撤销由delegate注册的事件,注意selector要与delegate中一致。
(3)一些快捷方法,如mouseenter(function),mouseout(function)等。
2.jQuery特效
使用特效,尽可能防止在回调function中再去调用相同的动画函数,避免产生循环动画,逼不得已,可以借助于setTimeout方法。
(1)隐藏与显示(利用css的hidden属性)
hide(),hide(time),hide(time,easing),hide(time,function),
hide(time, easing, function)
隐藏jQuery对象中的元素
show(),show(time),show(time,easing),show(time,function),
show(time, easing, function)
显示jQuery对象中的元素
toggle(),toggle(time),toggle(time,easing),toggle(time,function),
toggle(time, easing, function)
切换jQuery对象中的元素的显示和隐藏
toggle(boolean)
设置单向切换,当boolean为true时,只完成从隐藏到显示的切换,为false只完成从显示到隐藏的切换
(2)滑动(通过裁剪元素实现)
slideDown(),slideDown(time),slideDown(time,easing),slideDown(time,function),
slideDown(time, easing, function)
让元素内容从上到下逐渐显示
slideUp(),slideUp(time),slideUp(time,easing),slideUp(time,function),
slideUp(time, easing, function)
让元素内容从下到上逐渐消失
fadeToggle(time),fadeToggle(time,easing),fadeToggle(time,function),
- jQuery学习笔记(四) 事件及特效
- jquery常用事件及特效
- JQuery笔记(四)-动画和特效
- jQuery学习笔记:事件
- Jquery事件学习笔记
- jQuery事件学习笔记
- jQuery 学习笔记之 动画与特效
- jQuery-show()与html()及hide()用法 学习笔记四
- jQuery学习大总结(四)jQuery事件
- [jQuery学习系列四 ]4-Jquery学习四-事件操作
- learning jQuery 学习笔记四(+jQuery 1.4.1 API)--简单的事件
- Jquery学习笔记(四)
- jQuery实战学习笔记 (四)
- JQuery学习笔记(四)
- jquery学习笔记(四)
- jQuery学习笔记(四)
- jQuery学习笔记之四
- jQuery学习笔记(四)
- 【iOS开发】ld: library not found for -lPods-iDoctors-AFNetworking 编译报错Xcode
- Unable to locate package xxx
- 获取当前网络和地理位置
- 主流视频编码标准的发展
- Android编程至高武学之《如来神掌》第二式~金顶佛灯
- jQuery学习笔记(四) 事件及特效
- adb通过wifi连接android设备
- rpm 包管理
- Android 系列 6.9使用图像按钮增强UI设计
- 大型网站架构进化阶段
- 水果软件中的粘合与琶音命令使用方法
- NDK开发java调用c(三)
- Cloudera Manager 5 Overview
- win7旗舰版系统下载