IE下的事件监听器 attachEvent Bubble

IE_attachEvent_onclick.html

Bubble

<!DOCTYPE html>
<html>
<head>
    <style>
        #a {
            width: 500px;
            height: 500px;
            background: #ff0000
        }
        #b {
            width: 200px;
            height: 200px;
            background: #00ff00
        }
    </style>
</head>
<body>
    <div id="a">
        <div id="b"></div>
    </div>
</body>
<script>
    //函数
    var fa = function () {
        alert("a");
    }

    var fb = function (event) {
        alert("b");
    }

    //A
    var A = document.getElementById("a");
    A.attachEvent("onclick",fa);
    //B
    var B = document.getElementById("b");
    B.attachEvent("onclick",fb);
</script>
</html>

IE下的事件监听器：

IE提供的却是一种自有的，完全不同的甚至存在BUG的事件监听器，因此如果要让脚本在本浏览器中正常运行的话，就必须使用IE所支持的事件监听器。另外，Safari 浏览器中的事件监听器有时也存在一点不同。

在IE中，每个元素和window对象都有两个方法：attachEvent方法和detachEvent方法。

1 element.attachEvent("onevent",eventListener);

此方法的意思是在IE中要想给一个元素的事件附加事件处理函数，必须调用attachEvent方法才能创建一个事件监听器。attachEvent方法允许外界注册该元素多个事件监听器。

attachEvent接受两个参数。第一个参数是事件类型名，第二个参数eventListener是回调处理函数。这里得说明一下，有个经常会出错的地方，IE下 利用attachEvent注册的处理函数调用时this指向不再是先前注册事件的元素，这时的this为window对象。还有一点是此方法的事件类型名称必须加上一个”on”的前缀（如onclick）。

1 element.attachEvent("onevent",eventListener);

要想移除先前元素注册的事件监听器,可以使用detachEvent方法进行删除，参数相同。

posted @ 2017-10-16 15:51  sky20080101  阅读(272)  评论(0)    收藏  举报