jQuery之on/off/one支持的处理程序

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事件相关的事件顺序:

  1. keydown – 键按下的过程
  2. keypress – 键按下
  3. 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()事件执行

 参考网址

 

posted @ 2021-06-29 22:47  陆陆无为而治者  阅读(60)  评论(0编辑  收藏  举报