首页 > Web开发 > 详细

jQuery事件

时间:2019-08-23 22:41:01      阅读:109      评论:0      收藏:0      [点我收藏+]

  jQuery中的事件类型同JS大致相似,但也有部分不同的地方(例如使用方法、条件等)

基本方法                                                                

css

  用来修改CSS属性值,传入的参数可以是值/对象

  技术分享图片

text

  类似于JS中的innerText,修改指定标签节点内部的文本

html

  类似于JS中的innerHTML,修改指定标签内部的HTML结构(即创建标签修改标签等操作)

 

鼠标事件                                                                

click&dbclick

  鼠标单击/双击时触发

  同时绑定时,双击事件触发前会触发单击事件

mousedown&mouseup

  鼠标点击下去/抬起时触发

mouseenter&mouseleave&hover

  鼠标进入/离开/悬停在绑定元素的区域时触发

   其中hover为enter和leave的结合,可以传入两个函数,第一个为enter时触发,第二个在leave时触发

mouseover&mouseout

  效果同mouseenter&mouseleave,但是如果绑定在父元素上时,其子元素也会响应该事件(即有事件冒泡/事件捕获效果)

  不推荐使用

mousemove

  在DOM元素内部移动鼠标时触发,外部移动不触发

scroll

  在DOM元素的高度发生变化时触发

 

键盘事件                                                                  

keydown&keyup

  当键盘/按钮按下去/松开的时候触发,但绑定事件的元素必须光标在上面时才会触发

  可以传入event参数(浏览器的一个对象)

  控制台输出的key为按下/松开的键区分大小写),而keyCode则是按下/松开按键的小写字母ASCII码不区分大小写),大多时候用keyCode(只是识别按的键而不是输入的内容)

keypress

  当键盘输入了一个可以在屏幕上产生字符的按键时才触发(Shift、Ctrl等无效

 

其他事件                                                                  

ready

  DOM载入就绪时触发

resize

  浏览器窗口大小变化时触发,绑定在window对象

focus/blur

  获得/失去焦点时触发,绑定在表单元素上

change

  元素值发生改变时触发(value变化

  type属性值为number的表单元素只有在点击上下键时才触发,输入时无效

  该事件需要一定的触发时间不是实时

select

  文本被选择时触发,绑定在textarea文本类型的input元素

  能触发该事件的元素,必须在选中文本后可以修改文本

submit

  提交表单时触发,可以提交表单/阻止表单提交/提交表单时做一些需要的事(例如限定提交时某个部分的输入内容)

  技术分享图片

 

事件参数                                                                   

  所有事件都会传入event对象作为参数,可以从中获取事件中的详细信息

  一般对于鼠标事件键盘事件,需要用event对象(获取按键的keyCode等)

 

事件绑定&取消                                                         

事件绑定

  对选择的DOM对象用on来绑定事件,其中至少传入两个参数(事件类型事件句柄

  技术分享图片

  绑定多个事件时,可以像添加键值对的方式,事件类型作为键,事件句柄作为值

  技术分享图片

事件移除

  对选择的DOM对象,用off取消绑定在其上面的一个/多个事件处理函数

  技术分享图片

事件绑定一次后移除

  对于绑定并只执行一次就解除的事件,用one来操作

  技术分享图片

jQuery事件

原文:https://www.cnblogs.com/shige720/p/11384478.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!