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 相关文章推荐
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
Jan 21 Javascript
Node.js异步I/O学习笔记
Nov 04 Javascript
JS实现鼠标滑过链接改变网页背景颜色的方法
Oct 20 Javascript
Javascript之String对象详解
Jun 08 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
Apr 01 Javascript
深入理解JavaScript 参数按值传递
May 24 Javascript
解决html input验证只能输入数字,不能输入其他的问题
Jul 21 Javascript
JavaScript Date对象应用实例分享
Oct 30 Javascript
js中数组常用方法总结(推荐)
Apr 09 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
Nov 09 Javascript
JavaScript中CreateTextFile函数
Aug 30 Javascript
vue全局使用axios的操作
Sep 08 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网页游戏学习之Xnova(ogame)源码解读(八)
2014/06/23 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
js中的值类型和引用类型小结 文字说明与实例
2010/12/12 Javascript
基于json的jquery地区联动效果代码
2011/07/06 Javascript
js判断为空Null与字符串为空简写方法
2014/02/24 Javascript
详谈JavaScript内存泄漏
2014/11/14 Javascript
JSON取值前判断
2014/12/23 Javascript
AngularJs表单验证实例详解
2016/05/30 Javascript
vue中渐进过渡效果实现
2016/10/27 Javascript
vue时间格式化实例代码
2017/06/13 Javascript
ES6学习教程之Map的常用方法总结
2017/08/03 Javascript
iframe高度自适应及隐藏滚动条的实例详解
2017/09/29 Javascript
Node.js微信 access_token ( jsapi_ticket ) 存取与刷新的示例
2017/09/30 Javascript
360提示[高危]使用存在漏洞的JQuery版本的解决方法
2017/10/27 jQuery
基于rollup的组件库打包体积优化小结
2018/06/18 Javascript
微信小程序连接服务器展示MQTT数据信息的实现
2020/07/14 Javascript
Openlayers测量距离与面积的实现方法
2020/09/25 Javascript
python实现mysql的单引号字符串过滤方法
2015/11/14 Python
Python实现动态图解析、合成与倒放
2018/01/18 Python
python简单商城购物车实例代码
2018/03/15 Python
python实现指定字符串补全空格、前面填充0的方法
2018/11/16 Python
Python给图像添加噪声具体操作
2019/03/03 Python
Django 创建/删除用户的示例代码
2019/07/24 Python
python在OpenCV里实现投影变换效果
2019/08/30 Python
pytorch数据预处理错误的解决
2020/02/20 Python
基于Tensorflow读取MNIST数据集时网络超时的解决方式
2020/06/22 Python
django和flask哪个值得研究学习
2020/07/31 Python
Python基于mediainfo批量重命名图片文件
2020/12/29 Python
HTML5 语义化结构化规范化
2008/10/17 HTML / CSS
html5 标签
2009/07/16 HTML / CSS
HTML5 localStorage使用总结
2017/02/22 HTML / CSS
甘南现象心得体会
2014/09/11 职场文书
mysql批量新增和存储的方法实例
2021/04/07 MySQL
基于angular实现树形二级表格
2021/10/16 Javascript
详解Python+OpenCV进行基础的图像操作
2022/02/15 Python
Java 超详细讲解IO操作字节流与字符流
2022/03/25 Java/Android