query事件整理(多个事件可以同时绑定到一个元素中)
2017-09-03 22:34
309 查看
方法 | 描述 |
---|---|
bind() | 向匹配元素附加一个或更多事件处理器 |
blur() | 触发、或将函数绑定到指定元素的 blur 事件 |
change() | 触发、或将函数绑定到指定元素的 change 事件 |
click() | 触发、或将函数绑定到指定元素的 click 事件 |
dblclick() | 触发、或将函数绑定到指定元素的 double click 事件 |
die() | 移除所有通过 live() 函数添加的事件处理程序。 |
error() | 触发、或将函数绑定到指定元素的 error 事件 |
focus() | 触发、或将函数绑定到指定元素的 focus 事件 |
keydown() | 触发、或将函数绑定到指定元素的 key down 事件 |
keypress() | 触发、或将函数绑定到指定元素的 key press 事件 |
keyup() | 触发、或将函数绑定到指定元素的 key up 事件 |
live() | 为当前或未来的匹配元素添加一个或多个事件处理器 |
load() | 触发、或将函数绑定到指定元素的 load 事件 |
mousedown() | 触发、或将函数绑定到指定元素的 mouse down 事件 |
mouseenter() | 触发、或将函数绑定到指定元素的 mouse enter 事件 |
mouseleave() | 触发、或将函数绑定到指定元素的 mouse leave 事件 |
mousemove() | 触发、或将函数绑定到指定元素的 mouse move 事件 |
mouseout() | 触发、或将函数绑定到指定元素的 mouse out 事件 |
mouseover() | 触发、或将函数绑定到指定元素的 mouse over 事件 |
mouseup() | 触发、或将函数绑定到指定元素的 mouse up 事件 |
one() | 向匹配元素添加事件处理器。每个元素只能触发一次该处理器。 |
ready() | 文档就绪事件(当 HTML 文档就绪可用时) |
resize() | 触发、或将函数绑定到指定元素的 resize 事件 |
scroll() | 触发、或将函数绑定到指定元素的 scroll 事件 |
select() | 触发、或将函数绑定到指定元素的 select 事件 |
submit() | 触发、或将函数绑定到指定元素的 submit 事件 |
toggle() | 绑定两个或多个事件处理器函数,当发生轮流的 click 事件时执行。 |
trigger() | 所有匹配元素的指定事件 |
triggerHandler() | 第一个被匹配元素的指定事件 |
unbind() | 从匹配元素移除一个被添加的事件处理器 |
undelegate() | 从匹配元素移除一个被添加的事件处理器,现在或将来 |
unload() | 触发、或将函数 f619 绑定到指定元素的 unload 事件 |
实例
当点击鼠标时,隐藏或显示 p 元素:$("button").bind("click",function(){ $("p").slideToggle(); });
bind()
方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数。
实例
当输入域失去焦点 (blur) 时改变其颜色:$("input").blur(function(){ $("input").css("background-color","#D6D6FF"); });
亲自试一试
定义和用法
当元素失去焦点时发生 blur 事件。blur() 函数触发 blur 事件,或者如果设置了 function 参数,该函数也可规定当发生 blur 事件时执行的代码。
提示:早前,blur 事件仅发生于表单元素上。在新浏览器中,该事件可用于任何元素。
实例
当输入域发生变化时改变其颜色:$(".field").change(function(){ $(this).css("background-color","#FFFFCC"); });
亲自试一试
定义和用法
当元素的值发生改变时,会发生 change 事件。该事件仅适用于文本域(text field),以及 textarea 和 select 元素。
change() 函数触发 change 事件,或规定当发生 change 事件时运行的函数。
注释:当用于 select 元素时,change 事件会在选择某个选项时发生。当用于 text field 或 text area 时,该事件会在元素失去焦点时发生。
实例
当双击按钮时,隐藏或显示元素:$("button").dblclick(function(){ $("p").slideToggle(); });
亲自试一试
定义和用法
当双击元素时,会发生 dblclick 事件。当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click。
在很短的时间内发生两次 click,即是一次 double click 事件。
dblclick() 方法触发 dblclick 事件,或规定当发生 dblclick 事件时运行的函数。
提示:如果把 dblclick 和 click 事件应用于同一元素,可能会产生问题。
当点击鼠标时,隐藏或显示 p 元素:
$("div").delegate("button","click",function(){ $("p").slideToggle(); });
亲自试一试
定义和用法
delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。
实例
移除所有通过 live() 方法向 p 元素添加的事件处理程序:$("p").die();
亲自试一试
定义和用法
die() 方法移除所有通过 live() 方法向指定元素添加的一个或多个事件处理程序。如果图像不存在,则用一段预定义的文本取代它:
$("img").error(function(){ $("img").replaceWith("Missing image!");
});
亲自试一试
定义和用法
当点击 p 元素时,增加该元素的文本大小:$("p").one("click",function(){ $(this).animate({fontSize:"+=6px"}); });
亲自试一试
定义和用法
one() 方法为被选元素附加一个或多个事件处理程序,并规定当事件发生时运行的函数。当使用 one() 方法时,每个元素只能运行一次事件处理器函数。
当元素遇到错误(没有正确载入)时,发生 error 事件。
error() 方法触发 error 事件,或规定当发生 error 事件时运行的函数。
提示:该方法是 bind('error', handler) 的简写方式。
移除所有 p 元素的事件处理器:
$("button").click(function(){ $("p").unbind(); });
亲自试一试
定义和用法
unbind() 方法移除被选元素的事件处理程序。该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行。
ubind() 适用于任何通过 jQuery 附加的事件处理程序。
当用户点击链接离开本页时,弹出一个消息框:
$(window).unload(function(){ alert("Goodbye!"); });
亲自试一试
定义和用法
当用户离开页面时,会发生 unload 事件。具体来说,当发生以下情况时,会发出 unload 事件:
点击某个离开页面的链接
在地址栏中键入了新的 URL
使用前进或后退按钮
关闭浏览器
重新加载页面
unload() 方法将事件处理程序绑定到 unload 事件。
unload() 方法只应用于 window 对象。
相关文章推荐
- javascript同一个元素同时绑定click和dblclick事件(同时单击和双击事件)
- 使用jquery当页面打开时,将一个事件绑定到控件(同时执行两个事件),并修改加载样式类中的样式
- W3C下的冒泡和捕获机制。到底是冒泡呢。还是捕获呢。一个DOM元素绑定多个事件时如何执行。
- 一个DOM元素绑定多个事件时,先执行冒泡还是捕获
- 给一个元素同时绑定click和dbclick存在的问题
- 使用livequery插件对动态创建的DOM元素进行事件绑定
- 已知一个几乎有序的数组,几乎有序是指,如果把数组排好顺序的话,每个元素移动的距离可以不超过k,并且k相对于数组来说比较小。请选择一个合适的排序算法针对这个数据进行排序。 给定一个int数组A,同时给定
- off() 方法 与 unbind() 方法移除绑定事件的处理程序。one()函数用于为每个匹配元素的一个或多个事件绑定一次性事件处理函数
- jQuery给一个元素绑定事件前,一次点击会多次触发的问题所在
- 如何为一个按钮(View)设置任意多次点击事件以及可以同时响应多个多次点击事件
- CSS3 GENERATOR可以同时为一个元素完成border-radius、box-shadow、gradient和opacity多项属性的设置
- W3C下的冒泡和捕获机制。到底是冒泡呢。还是捕获呢。一个DOM元素绑定多个事件时如何执行。
- 【技术】创建一个 <input> 元素,同时设定 type 属性、属性值,以及一些事件
- 一个DOM元素绑定多个事件时,先执行冒泡还是捕获
- W3C下的冒泡和捕获机制。到底是冒泡呢。还是捕获呢。一个DOM元素绑定多个事件时如何执行。
- JavaScript之jQuery-10 T-Query(T-Query、基本选择器、T-Query对象、操作方法、创建元素、事件绑定)
- JQuery mouse..事件+元素显示隐藏 切换 +淡入淡出+滑动效果。(可以做一个ul li下拉框滑动收起效果:slideUp)
- 【JavsScript】一个元素绑定多个事件
- 如何实现对一个DOM元素进行深拷贝,包括它绑定的事件
- JavaScript实现父子dom同时绑定两个点击事件,一个用捕获,一个用冒泡时执行顺序的方法