Question

我正在尝试创建一个小型JavaScript库供我私人使用目前，我正在尝试创建event方法，以将事件添加到一个元素或多个元素问题具体涉及IE 6, 7, 8 每个人都知道我们是否对很多元素做了一个事件，然后当我们在回调函数中写'this'时，表示你点击它的元素，例如使用jquery。

$(".box").on('click', function(){
    $(this).html(); // get content of the element that clicked on it.
})

在我的库中this对象在现代浏览器ff, ch, op, saf, IE9+上运行正常，但在IE 6,7,8上无效。

以下是负责在我的库中创建活动的部分：

event: function (event, callback, sync) {
    // if the user uses modern browser.    
    // 'this.length' to know how many elements (selector).
    if (document.addEventListener) {
        // if the selector more than one element
        if (this.length > 1) {
            while (this.length--) {
                this[this.length].addEventListener(event, callback, sync);
            }
        } else {
            this[0].addEventListener(event, callback, sync);
        }
    } else if (window.attachEvent) {
        if (this.length > 1) { 
            while (this.length--) {
                this[this.length].attachEvent('on' + event, callback);
            }
        } else {
            this[0].attachEvent('on' + event, callback);
        }
    } else {
        console.log(false);
        return false;
    }
    return this;

以下是使用我的库在几个元素上应用事件的示例，使用名为box的类。

HTML：

<div id="box">
    <p class="box">span</p>
    <p class="box">span 2</p>
    <p class="box">span 3</p>
</div>

使用Javascript：

oo('.box').event('click', function () {
    alert(this.innerHTML);
});

下一个代码仅适用于旧浏览器

oo('.box').event('click', function() {
    alert(window.event.srcElement.innerHTML);
});

this.innerHTML意思是点击某个元素会获得其内容上一个示例在现代浏览器中运行良好，但在IE 6, 7, 8上无效，并且给我undefined

Answer 1

此问题的解决方案如下：

this[this.length].attachEvent('on' + event, function(){ callback.call(window.event.srcElement); });

如何在旧版浏览器中使用事件处理程序返回“this”对象

1 个答案: