jQuery中mouseenter vs mouseover 以及 mouseleave vs mouseout

mouseenter 和 mouseleave 如果该对象有子元素,则进入子元素时不会触发对应的 mouseleave 和 mouseenter事件,可以想象子元素不存在,比如你和你的孩子住在一套房里,如果孩子还很小,尽管睡不同的房间,但你不会感觉你进入到另一个家庭中,这还是老子的家, 我说话还算数 :) #=.=!

mouseover 和 mouseout 如果该对象有子元素,则进入子元素时会触发对应的事件,可以想象被子元素挖了个坑, mouseover从父到子实际上是父over父out(父)子over, 而mouseout由子到父则是(父)out父over父out, 所以实际上可以认为有两次事件。同上的举例,如果孩子大了乃至成了家,虽然还在一个屋檐下,但你可以明显感觉到这已然是2个家庭,孩子已经不太听你的了。还是赶紧买房,让他们出去住吧 :( #=.=! 两个事件都以O开头,O就像内部的一个坑。

代码例子可以参考

http://www.w3school.com.cn/tiy/t.asp?f=jquery_event_mouseenter_mouseover

http://www.w3school.com.cn/tiy/t.asp?f=jquery_event_mouseleave_mouseout

 

posted @ 2015-06-05 16:08  Hopecho  阅读(226)  评论(0编辑  收藏  举报