什么是 HTML DOM 事件?

jquery 是为 html dom 事件处理特别设计的


什么是 HTML DOM 事件?

页面对不同访问者的响应叫做事件

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法,比如

  • 在元素上移动鼠标
  • 选取单选按钮
  • 点击元素

在事件中经常使用术语 "触发",例如

"当你按下按键时触发 keypress 事件"


常见 HTML DOM 事件

鼠标事件键盘事件表单事件文档/窗口事件
clickkeypresssubmitload
dblclickkeydownchangeresize
mouseenterkeyupfocusscroll
mouseleaveblurunload

jQuery 事件方法

在 jQuery 中,大多数 DOM 事件都有一个等效的 jQuery 方法

比如页面中指定一个点击事件

下一步是定义什么时间触发事件

我们可以通过一个事件函数实现


常用的 jQuery 事件方法

$(document).ready()

$(document).ready() 方法允许我们在文档完全加载完后执行函数

click()

click() 方法是当按钮点击事件被触发时会调用一个函数

该函数在用户点击 HTML 元素时执行

下面的范例中,当点击事件在某个 <p> 元素上触发时,隐藏当前的 <p> 元素


dblclick()

当双击元素时,会发生 dblclick 事件

dblclick() 方法触发 dblclick 事件,或规定当发生 dblclick 事件时运行的函数


mouseenter()

当鼠标指针穿过元素时,会发生 mouseenter 事件

mouseenter() 方法触发 mouseenter 事件,或规定当发生 mouseenter 事件时运行的函数


mouseleave()

当鼠标指针离开元素时,会发生 mouseleave 事件

mouseleave() 方法触发 mouseleave 事件,或规定当发生 mouseleave 事件时运行的函数


mousedown()

当鼠标指针移动到元素上方,并按下鼠标按键时,会发生 mousedown 事件

mousedown() 方法触发 mousedown 事件,或规定当发生 mousedown 事件时运行的函数


mouseup()

当在元素上松开鼠标按钮时,会发生 mouseup 事件

mouseup() 方法触发 mouseup 事件,或规定当发生 mouseup 事件时运行的函数


hover()

hover()方法用于模拟光标悬停事件

当鼠标移动到元素上时,会触发指定的第一个函数(mouseenter)
当鼠标移出这个元素时,会触发指定的第二个函数(mouseleave)


focus()

当元素获得焦点时,发生 focus 事件

当通过鼠标点击选中元素或通过 tab 键定位到元素时,该元素就会获得焦点

focus() 方法触发 focus 事件,或规定当发生 focus 事件时运行的函数


blur()

当元素失去焦点时,发生 blur 事件

blur() 方法触发 blur 事件,或规定当发生 blur 事件时运行的函数

本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!