jQuery滑鼠劃入划出

標籤：活動   his   先來   mouseover   rem   cti   之間   log   pre   

　　今天來簡單的談談jQuery的一個劃入划出的方法，。首先劃入划出能想到的東西有哪些呢，。

　　1：hover

　　2：mouseenter/mouseleave

　　3:mouseover/mouseout.

　　一共是三中方法，先來說說他們的使用方法

$(".evo").hover(function(){$(this).addClass("red");　　　　　　 },function(){ 　　$(this).removeClass("red");　　 })

　　這樣寫有點亂，那就寫清楚點

$("").hover(function(){        },function(){                    })

　　其實就這麼一點代碼，一共兩個function,是因為劃入划出，第一個function定義的是劃入的效果，第二個function裡面定義的是划出的效果，。

　　在來看看第二種

　　

 $(".evo").mouseenter(function(){    $(this).addClass("red");         })        $(".evo").mouseleave(function(){            $(this).removeClass("red");        })

　　再來看看第三種

　　

 $(".evo").mouseover(function(){    $(this).addClass("red");         })         $(".evo").mouseout(function(){            $(this).removeClass("red");         })

　　再來說說他們的區別，這三者之間的區別其實只是兩者的區別，首先hover其實和mouseenter+mouseleave是一樣的，從字面上就可以理解，一個是滑鼠進入，一個是滑鼠離開，而mouseover/mouseout和他們之間的區別是上面呢，一般情況下不容易看出來，但是給他們觸發的元素裡面有子項目就可以看出效果了，。

當用hover或者mouseenter/mouseleave的時候，滑鼠移到元素上的時候會觸發時間，當再在元素上移到器子項目上的時候就不會再觸發了，。

但是mouseover/mouseout就不同了，滑鼠移到元素上的時候會觸發時間，由元素上移到子項目又會觸發，由子項目移到父元素又會再次觸發，會不停的觸發。

而hover或者mouseenter/mouseleave只會觸發一次。滑鼠只要是在元素中和其父元素中活動都不會再次觸發。

 

jQuery滑鼠劃入划出