mouseover 和 hover 方法的不同?jquery
hover包括了鼠標移到對象上,同時鼠標再移出對象的過程,相應的子類也被選中。
mouseover是鼠標經過對象時,不包含他的子類同時被選中。
主要區別在於 hover元素的子類上也有添加了事件驅動。而mouseover 只對當前元素添加事件驅動。
且 hover 事件包含mouseover 事件
mousemove(fn);
在每一個匹配元素的mousemove事件中綁定一個處理函數。
hover(over, out);
一個模仿懸停事件(鼠標移動到一個對象上面及移出這個對象)的方法。這是一個自定義的方法,它為頻繁使用的任務提供了一種“保持在其中”的狀態。
當鼠標移動到一個匹配的元素上面時,會觸發指定的第一個函數。當鼠標移出這個元素時,會觸發指定的第二個函數。而且,會伴隨着對鼠標是否仍然處在特定元素中的檢測(對子類的檢測),如果是,則會繼續保持“懸停”狀態,而不觸發移出事件(mouseout)。
$("td").hover( function () { $(this).addClass("hover"); }, function () { $(this).removeClass("hover"); } );
在jquery源碼中有這么一段:
hover: function( fnOver, fnOut ) {
return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
}
也就是說 hover!= mouseover+mouseout。但hover=mouseenter + mouseleave。
從前只知道像 hover、link、visited 和 active 這樣的偽類只能應用到 a 標簽,即要寫成 a:hover、a:link、a:visited、a:active。其實這四個玩意是可以應用到其他的 html 標簽、指定給其他定義的 class 上。
有關於 CSS 偽類可參考:http://www.w3school.com.cn/css/css_pseudo_classes.asp
a:link {color: #FF0000} /* 未訪問的鏈接 */
a:visited {color: #00FF00} /* 已訪問的鏈接 */
a:hover {color: #FF00FF} /* 鼠標移動到鏈接上 */
a:active {color: #0000FF} /* 選定的鏈接 */