jQuery之on/off/one支持的处理程序
定义
在jQuery中，on/off/one的定义如下。
|
方法 |
描述 |
|
on() |
向元素添加事件处理程序 |
|
off（） |
移除通过on（）添加的事件处理程序 |
|
one() |
向被选元素添加一个或多个事件处理程序。该处理程序只能被每个元素触发一次 |
语法格式如下：
1 $(selector).on(event,childSelector,data,function) 2 $(selector).off(event,childSelector,data,function) 3 $(selector).one(event,childSelector,data,function)
|
参数 |
描述 |
|
event |
必需。规定要从被选元素添加的一个或多个事件或命名空间。 由空格分隔多个事件值，也可以是数组。必须是有效的事件。 |
|
childSelector |
可选。规定只能添加到指定的子元素上的事件处理程序（且不是选择器本身，比如已废弃的 delegate() 方法）。 |
|
data |
可选。规定传递到函数的额外数据。 |
|
function |
可选。规定当事件发生时运行的函数。 |
这里的event表示的是事件，那么他们支持哪些事件呢？在此，我简单标记一下。
|
方法 |
描述 |
|
blur() |
添加/触发失去焦点事件 |
|
change() |
添加/触发change事件 |
|
click() |
添加/触发click事件 |
|
focus() |
添加/触发获取焦点事件 |
|
focusin() |
当元素（或在其内的任意元素）获得焦点时发生 |
|
focusout（） |
当元素（或在其内的任意元素）获得失去时发生 |
|
keydown（） |
当键盘按下时执行事件 |
|
keypress（） |
当键盘按下后执行事件 |
|
keyup（） |
当键盘松开时执行事件 |
|
mousedown（） |
鼠标按下时执行 |
|
mouseenter（） |
鼠标进入时执行 |
|
mouseleave（） |
鼠标离开时执行 |
|
mousemove（） |
鼠标在指定元素移动时执行 |
|
mouseup（） |
鼠标释放时执行 |
|
mouseover（） |
当指针位于元素上方时触发 |
|
mouseout（） |
鼠标离开被选元素时触发 |
|
ready（） |
元素加载后执行事件 |
|
resize（） |
对窗口进行调节时执行方法 |
|
scroll（） |
当滚动指定元素时，触发该方法 |
|
select（） |
当textarea或文本类型的input元素的文本被选择时触发 |
|
submit（） |
表单提交时触发 |
|
contextmenu() |
鼠标右击元素时执行 |
注：与keypress事件相关的事件顺序：
- keydown – 键按下的过程
- keypress – 键按下
- keyup -键松开
注：mouseenter/mouseleaver 和 mouseover/mouseout 的区别和联系
- mouseenter/mouseleaver 和 mouseover/mouseout在鼠标进入或离开被选元素时触发。
- mouseover当鼠标进入被选元素或者任意子元素都会触发，通常与mouseout配套使用。所以，被选元素如果内部包含多个子元素，鼠标在元素内移动可能会触发多次。
- mouseenter事件只在鼠标进入被选元素时触发，通常与mouseleave配套使用。所以，进入一次备选元素，只会触发一次。
总结
jQuery支持绑定大部分处理程序。不支持的包括以下处理程序：
- 废除或弃用的bind()、delegate()、die()、error()、live()、load()、toggle()、unbind()、undelegate()、unload()。
- 用于绑定或移除处理程序的事件bind()、delegate()、die()、live()、load()、off()、on()、one()、unbind()、undelegate()、unload()。
- 参数不一致的事件hover()、trigger()、triggerHandler()。
- 其他：如$.proxy、$.holdReady()。
|
方法 |
描述 |
|
hover() |
鼠标悬停时，执行方法，等价于mouseenter + mouseleave |
|
$.proxy |
接受一个已有的函数，并返回特定上下文的新函数 |
|
trigger() |
触发被选定元素指定的事件以及事件的默认行为（例如提交表单） |
|
triggerHandler() |
触发被选定元素的指定事件 |
|
$.holdReady() |
暂停或恢复ready()事件执行 |
参考网址
- jQuery事件方法：https://www.runoob.com/jquery/jquery-ref-events.html
- jQuery keypress（）方法：https://www.runoob.com/jquery/event-keypress.html