
上QQ阅读APP看书,第一时间看更新
3.4.2 jQuery的鼠标事件
1.jQuery中常见的鼠标事件
鼠标事件是指鼠标在网页页面进行相关操作时触发的事件,jQuery中常见的鼠标事件如表3.7所示。
表3.7 Quer中常见的鼠标事件

2.鼠标事件示例
(1)click事件

(2)dbclick事件

(3)mous edown事件

(4)mous eup事件

(5)mouseover事件和mouseout事件

3.hover()方法
hover()是一个处理多个不同事件的方法,使用该方法时需要2个处理函数作参数。当鼠标进入所选元素时,就执行第1个参数的函数;当鼠标离开所选元素时,则执行第2个参数的函数。
【例3-12】 实现表格的隔行变色,当鼠标悬停时突出显示某行。其效果如图3.12所示。


图3.12 鼠标悬停时突出显示某行


在本例中,使用了jQuery的addClass()方法和removeClass()方法,addClass()方法是向被选元素添加一个类,removeClass()方法则是向被选元素删除一个类。