javascript 兼容FF的onmouseenter和onmouseleave的代码


Posted in Javascript onJuly 19, 2008

javascript 兼容FF的onmouseenter和onmouseleave的代码
IE下有 onmouseenter和onmouseleave来解决。
可惜ff就没有。  我再想 , 为什么这么好的功能,为什么ff不引用呢?
还有ie中的onpropertychange  ,哎,ff中都没有。。。

对比例子中引入了一段js ,来兼容FF的onmouseenter和onmouseleave. :

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; 
    }     
}; 
本篇文章来源于 cssrain.cn 原文链接:http://www.cssrain.cn/article.asp?id=952
Javascript 相关文章推荐
各种常用浏览器getBoundingClientRect的解析
May 21 Javascript
javascript 匿名函数的理解(透彻版)
Jan 28 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
Jan 29 Javascript
关于Vue.js一些问题和思考学习笔记(1)
Dec 02 Javascript
jQuery实现导航栏头部菜单项点击后变换颜色的方法
Jul 19 jQuery
详解基于node的前端项目编译时内存溢出问题
Aug 01 Javascript
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
Jan 16 Javascript
微信小程序中使用ECharts 异步加载数据的方法
Jun 27 Javascript
深入理解Node内建模块和对象
Mar 12 Javascript
微信小程序和H5页面间相互跳转代码实例
Sep 19 Javascript
浅探express路由和中间件的实现
Sep 30 Javascript
JS+CSS实现随机点名(实例代码)
Nov 04 Javascript
javascript 获取网页参数系统
Jul 19 #Javascript
javascript import css实例代码
Jul 18 #Javascript
番茄的表单验证类代码修改版
Jul 18 #Javascript
神奇的代码 通杀各种网站-可随意修改复制页面内容
Jul 17 #Javascript
js 新浪的一个图片播放图片轮换效果代码
Jul 15 #Javascript
纯js实现的论坛常用的运行代码的效果
Jul 15 #Javascript
点图片上一页下一页翻页效果
Jul 09 #Javascript
You might like
php绘制一条弧线的方法
2015/01/24 PHP
php检查日期函数checkdate用法实例
2015/03/19 PHP
js 操作select相关方法函数
2009/12/06 Javascript
JS对象与JSON格式数据相互转换
2012/02/20 Javascript
让AJAX不依赖后端接口实现方案
2012/12/03 Javascript
js中的hasOwnProperty和isPrototypeOf方法使用实例
2014/06/06 Javascript
node.js中的path.isAbsolute方法使用说明
2014/12/08 Javascript
javascript+ajax实现产品页面加载信息
2015/07/09 Javascript
基于jquery实现图片上传本地预览功能
2016/01/08 Javascript
JS组件Form表单验证神器BootstrapValidator
2016/01/26 Javascript
jQuery获取checkbox选中的值
2016/01/28 Javascript
深入分析node.js的异步API和其局限性
2016/09/05 Javascript
详解angularJs指令的3种绑定策略
2017/04/13 Javascript
微信小程序 wx:for的使用实例详解
2017/04/27 Javascript
bmob js-sdk 在vue中的使用教程
2018/01/21 Javascript
vue-router懒加载速度缓慢问题及解决方法
2018/11/25 Javascript
d3绘制基本的柱形图的实现代码
2018/12/12 Javascript
JS实现放烟花效果
2020/03/10 Javascript
JavaScript 装逼指南(js另类写法)
2020/05/10 Javascript
vue实现lodop打印功能的示例
2020/11/11 Javascript
[03:49]显微镜下的DOTA2第十五期—VG登基之路完美团
2014/06/24 DOTA
对Python3中bytes和HexStr之间的转换详解
2018/12/04 Python
对python opencv 添加文字 cv2.putText 的各参数介绍
2018/12/05 Python
用Python实现校园通知更新提醒功能
2019/11/23 Python
对python中 math模块下 atan 和 atan2的区别详解
2020/01/17 Python
美国著名的户外用品品牌:L.L.Bean
2018/01/05 全球购物
美国背景检查、公共记录和人物搜索网站:BeenVerified
2018/02/25 全球购物
澳大利亚Rockwear官网:女子瑜伽、健身和运动服
2021/01/26 全球购物
高三自我鉴定怎么写
2013/10/19 职场文书
医学生职业规划范文
2014/01/05 职场文书
市场总监岗位职责
2015/02/11 职场文书
2015年公司工作总结
2015/04/25 职场文书
校长新学期致辞
2015/07/30 职场文书
传单、海报早OUT了,另类传单营销方案送给你!
2019/07/15 职场文书
浅谈Redis中的RDB快照
2021/06/29 Redis
webpack的移动端适配方案小结
2021/07/25 Javascript