06-jQuery事件

jQuery事件

鼠标事件

方法名	描述
jQuery.prototype.click(callback)	单击事件
jQuery.prototype.dbclick(callback)	双击事件
jQuery.prototype.mousedown(callback)	鼠标按下事件
jQuery.prototype.mouseup(callback)	鼠标弹起事件
jQuery.prototype.mousemove(callback)	鼠标移动事件
jQuery.prototype.mouseover(callback)	鼠标移入事件（移入子元素也会触发）
jQuery.prototype.mouseout(callback)	鼠标移出事件（移出子元素也会触发）
jQuery.prototype.mouseenter(callback)	鼠标移入事件（移入子元素不会触发）
jQuery.prototype.mouseleave(callback)	鼠标移出事件（移出子元素不会触发）
jQuery.prototype.hover(inCallback,outCallback)	鼠标移入移出（mouseenter和mouseleave）事件综合事件，若只写一个函数则移入移出都会触发该函数
jQuery.prototype.contextmenu(callback)	鼠标右击事件

键盘事件

方法名	描述
jQuery.prototype.keydown(callback)	键盘按下事件（可监听功能键、组合键）
jQuery.prototype.keypress(callback)	键盘按下事件（仅监听单个字符）
jQuery.prototype.keyup(callback)	键盘弹起事件

表单事件

方法名	描述
jQuery.prototype.focusout(callback)	失去焦点事件（会冒泡）
jQuery.prototype.focusin(callback)	获得焦点事件（会冒泡）
jQuery.prototype.blur(callback)	失去焦点事件（不会冒泡）
jQuery.prototype.focus(callback)	获得焦点事件（不会冒泡）
jQuery.prototype.change(callback)	输入框value发生变化并且失去焦点时触发事件
jQuery.prototype.select(callback)	输入框文本被选中事件
jQuery.prototype.submit(callback)	表单提交事件

自定义事件

方法名	描述
jQuery.prototype.on(event,[selector],callback)	绑定事件，事件以字符串形式传入，所以可监听自定义事件 若指定选择器内容，代表该事件是选择器选中的子节点的委托事件 要注意的是jQuery中事件委托中回调函数中this指向event.target，是触发事件节点，即子节点
jQuery.prototype.off([event,callback])	无参解绑所有事件 指定事件名解绑指定事件名下的所有事件 指定事件绑定函数解绑指定事件函数
jQuery.prototype.trigger(event)	触发事件（并触发冒泡和默认行为，a标签默认行为除外），事件以字符串形式传入，所以可触发自定义事件
jQuery.prototype.triggerHandler(event)	触发事件（不会触发冒泡和默认行为），事件以字符串形式传入，所以可触发自定义事件

事件的命名空间

为自定义事件指定前缀，使用点分隔成段，只触发或解绑前缀事件，该命名空间内的所有事件都会触发，比如：自定义事件名click.1，该事件的命名空间就是click，所以触发click事时click.1也会触发；解绑click事件click.1也会解绑

jQuery事件对象

jQuery对原生的事件对象进一步进行了封装，可以兼容不同浏览器

属性

属性名	描述
event.currentTarget	正在触发事件的对象（可能是冒泡过程中的DOM元素，同等与this）
event.target	用户正在触发事件的对象（用户真正触发事件的DOM元素，不会发生变化）
event.type	事件类型
event.pageX	事件发生时鼠标相对页面X坐标
event.pageY	事件发生时鼠标相对页面Y坐标
event.which	鼠标按下的是那个键（1左，2中，3右）
event.timeStamp	触发事件的时间

方法

对于事件冒泡和默认行为也可以通过在监听函数中return false达到同样的效果

方法名	描述
event.stopPropagation()	阻止事件冒泡
event.preventDefault()	阻止事件默认行为