JavaScript学习 jquery9 事件处理2

$("Element").hover(over,out)

模拟鼠标悬停的事件，当鼠标移入移出选定元素的时候分别触发over和out事件。

参数：over：function 

            out：function

$("#p1").hover(function() {
$(this).addClass("hover");
alert("hover,鼠标已经移入这个区域p1！");
}, function() {
$(this).removeClass("hover");
})

$("Element").toggle(function,function)

与上面的方法雷同，当鼠标第一次点击的时候触发前者，当鼠标第二次点击的时候触发后者。

$("#div1").toggle(function() {
alert("我是鼠标第一次点击时所触发的");
}, function() {
alert("我是鼠标第二次点击时所触发的");
})

鼠标单击：

$("Element").click()

$("Element").click(function)

当鼠标点击的时候触发，具体的应用方法我想不用具体讲解了。因为大家看了我过去的所写的案例就已经有数了。

$("#bt1").click(function() {
alert("点击了第一个按钮");
})

鼠标双击：
$("Element").dblclick()

$("Element").dblclick(function)

与鼠标单击一样，只不过这个是鼠标双击事件。也就是说只有鼠标在选定的元素上双击才会触发此事件。dbl是Double的缩写。

$("#bt2").dblclick(function() {
alert("双击了第二个按钮");
})

鼠标点击前后：
$("Element").mousedown(function)

当鼠标点击后触发，从表面上看类似click事件，其实有本质上的区别。

$("#bt3").mousedown(function() {
alert("鼠标点击了第三个按钮，怎么样，效果和click很相似吧");
})

$("Element").mouseup(function)

当鼠标点击释放的时候触发。就是鼠标点击了元素当你松开鼠标按键的时候触发。

$("#bt4").mouseup(function() {
<span style="white-space:pre">	</span>alert("我是mouseup，鼠标点击元素后松开鼠标按钮时触发的");
})

鼠标的移动：

$("Element").mousemove(function)

当鼠标在选定的元素上来回移动的时候触发。

$("#bt4").mousemove(function() {
alert("当鼠标在选定的元素上来回移动的时候触发")
})

$("Element").mouseover(function)

当鼠标在移入选定的元素范围的时候触发，父级（包含标签）元素也会触发，冒泡事件。

$("#bt4").mouseover(function() {
alert("mouseover,当鼠标在移入选定的元素范围的时候触发")
})

$("Element").mouseenter(function)

当鼠标在移入选定的元素范围的时候触发。与mouseover有很大的区别就是他不是冒泡的事件，点击子元素的时候不会触发父级元素

$("#p3").mouseenter(function() {
alert("mouseenter,当鼠标在移入选定的元素范围的时候触发");
})

$("Element").mouseout(function)

当鼠标移出选定的元素范围的时候触发，是冒泡事件。

$("#p3").mouseout(function() {
alert("mouseout,当鼠标移出选定的元素范围的时候触发");
})

$("Element").mouseleave(function)

当鼠标移出选定的元素范围的时候触发。与mouseenter一样，不是冒泡事件

$("#p2").mouseleave(function() {
alert("mouseleave,当鼠标移出选定的元素范围的时候触发");
})