javascript 兼容FF的onmouseenter和onmouseleave的代碼
更新時(shí)間:2008年07月19日 19:33:32 作者:
經(jīng)過(guò)測(cè)試發(fā)現(xiàn),例子1 在 ff下抖動(dòng)的厲害,ie下稍微有點(diǎn)。
具體原因 其實(shí)就是 mouseout 的冒泡機(jī)制 引起的。

IE下有 onmouseenter和onmouseleave來(lái)解決。
可惜ff就沒(méi)有。 我再想 , 為什么這么好的功能,為什么ff不引用呢?
還有ie中的onpropertychange ,哎,ff中都沒(méi)有。。。
對(duì)比例子中引入了一段js ,來(lái)兼容FF的onmouseenter和onmouseleave. :
復(fù)制代碼 代碼如下:
var xb =
{
evtHash: [],
ieGetUniqueID: function(_elem)
{
if (_elem === window) { return 'theWindow'; }
else if (_elem === document) { return 'theDocument'; }
else { return _elem.uniqueID; }
},
addEvent: function(_elem, _evtName, _fn, _useCapture)
{
if (typeof _elem.addEventListener != 'undefined')
{
if (_evtName == 'mouseenter')
{ _elem.addEventListener('mouseover', xb.mouseEnter(_fn), _useCapture); }
else if (_evtName == 'mouseleave')
{ _elem.addEventListener('mouseout', xb.mouseEnter(_fn), _useCapture); }
else
{ _elem.addEventListener(_evtName, _fn, _useCapture); }
}
else if (typeof _elem.attachEvent != 'undefined')
{
var key = '{FNKEY::obj_' + xb.ieGetUniqueID(_elem) + '::evt_' + _evtName + '::fn_' + _fn + '}';
var f = xb.evtHash[key];
if (typeof f != 'undefined')
{ return; }
f = function()
{
_fn.call(_elem);
};
xb.evtHash[key] = f;
_elem.attachEvent('on' + _evtName, f);
// attach unload event to the window to clean up possibly IE memory leaks
window.attachEvent('onunload', function()
{
_elem.detachEvent('on' + _evtName, f);
});
key = null;
//f = null; /* DON'T null this out, or we won't be able to detach it */
}
else
{ _elem['on' + _evtName] = _fn; }
},
removeEvent: function(_elem, _evtName, _fn, _useCapture)
{
if (typeof _elem.removeEventListener != 'undefined')
{ _elem.removeEventListener(_evtName, _fn, _useCapture); }
else if (typeof _elem.detachEvent != 'undefined')
{
var key = '{FNKEY::obj_' + xb.ieGetUniqueID(_elem) + '::evt' + _evtName + '::fn_' + _fn + '}';
var f = xb.evtHash[key];
if (typeof f != 'undefined')
{
_elem.detachEvent('on' + _evtName, f);
delete xb.evtHash[key];
}
key = null;
//f = null; /* DON'T null this out, or we won't be able to detach it */
}
},
mouseEnter: function(_pFn)
{
return function(_evt)
{
var relTarget = _evt.relatedTarget;
if (this == relTarget || xb.isAChildOf(this, relTarget))
{ return; }
_pFn.call(this, _evt);
}
},
isAChildOf: function(_parent, _child)
{
if (_parent == _child) { return false };
while (_child && _child != _parent)
{ _child = _child.parentNode; }
return _child == _parent;
}
};
本篇文章來(lái)源于 cssrain.cn 原文鏈接:http://www.cssrain.cn/article.asp?id=952
您可能感興趣的文章:
- 淺談JQ中mouseover和mouseenter的區(qū)別
- 關(guān)于事件mouseover ,mouseout ,mouseenter,mouseleave的區(qū)別
- 快速移動(dòng)鼠標(biāo)觸發(fā)問(wèn)題及解決方法(ECharts外部調(diào)用保存為圖片操作及工作流接線mouseenter和mouseleave)
- Jquery利用mouseenter和mouseleave實(shí)現(xiàn)鼠標(biāo)經(jīng)過(guò)彈出層且可以點(diǎn)擊
- 為非IE瀏覽器添加mouseenter,mouseleave事件的實(shí)現(xiàn)代碼
- 跨瀏覽器的 mouseenter mouseleave 以及 compareDocumentPosition的使用說(shuō)明
- javascript中mouseenter與mouseover的異同
相關(guān)文章
JavaScript實(shí)現(xiàn)動(dòng)態(tài)留言板
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)動(dòng)態(tài)留言板,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-03-03小程序按鈕避免多次調(diào)用接口和點(diǎn)擊方案實(shí)現(xiàn)(不用showLoading)
這篇文章主要介紹了小程序按鈕避免多次調(diào)用接口和點(diǎn)擊方案實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04javascript獲取所有同類(lèi)checkbox選項(xiàng)(實(shí)例代碼)
javascript獲取所有同類(lèi)checkbox選項(xiàng)的簡(jiǎn)單實(shí)例。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-11-11js獲取最近一周一個(gè)月三個(gè)月時(shí)間的簡(jiǎn)單示例
時(shí)間的獲取和格式化是我們經(jīng)常遇到的問(wèn)題,下面這篇文章主要給大家介紹了關(guān)于利用js如何獲取最近一周一個(gè)月三個(gè)月時(shí)間的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2021-12-12layui 給數(shù)據(jù)表格加序號(hào)的方法
今天小編就為大家分享一篇layui 給數(shù)據(jù)表格加序號(hào)的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08微信小程序?qū)崿F(xiàn)音樂(lè)播放頁(yè)面布局
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)京東商品分類(lèi)側(cè)邊欄,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-12-12