JQuery的事件方法是触发器或者添加一个函数到被选择元素的事件处理程序,而JQuery的事件方法有很多,比如click()、change()、mouseover()等。这些事件都是平时写代码的时候经常会看见或者用的事件方法。
一、click()单击事件
语法:
$( selector).click(); 触发被选元素的click事件
$( selector).click(funtion); 添加函数到click事件
HTML代码
JQuery代码
这里就是通过单击button元素触发触发到p元素上的单击事件,也可以直接单击p元素触发单击事件,单击事件几乎可在任何一个元素上触发。这也是最常用click单击事件的原因之一。
二、mouseover()鼠标移入事件
语法:
$( selector).mouseover(); 触发被选元素的mouseover事件
$( selector).mouseover(funtion); 添加函数到mouseover事件
HTML代码
JQuery代码
这里是当鼠标指针位于元素上方时,会发生mouseover事件。
mouseover()方法触发mouseover事件或者添加当发生mouseover事件的时候运行的函数。
注意:mouseover事件(鼠标移入事件)和mouseenter事件(鼠标穿过事件)虽然看上去这两个事件的触发没有什么不一样。
但是mouseover事件在鼠标移动到选取元素和子元素上触发,而mouseenter事件只会在鼠标移动到选取的元素上触发。
三、mouseout()鼠标移出事件
语法:
$( selector).mouseout(); 触发被选元素的mouseout事件
$( selector).mouseout(funtion); 添加函数到mouseout事件
HTML代码
JQuery代码
这里是当鼠标指针离开被选元素时,会发生mouseout事件。
mouseover()方法触发mouseover事件或者添加当发生mouseover事件的时候运行的函数。
注意:mouseout事件(鼠标移入事件)和mouseleave事件(鼠标穿出事件)虽然看上去这两个事件的触发看起来也没有什么不一样。
但是mouseover事件在鼠标离开被选取元素和子元素上触发,而mouseenter事件只会在鼠标离开被选取的元素上触发。