Question

我在这里有一个小问题，我不想为点击事件添加事件监听器。当偶然发生单击时，函数会被正常触发，但是当它应该调用另一个函数时，它会给出错误：

TypeError: this.addEvent is not a function

代码：

class TEST {
    construct(){
        this.events = [];
    }
}

TEST.prototype.ready = function(callback) {
    if (document.readyState!='loading') callback();
    else if (document.addEventListener) document.addEventListener('DOMContentLoaded', callback);
    else document.attachEvent('onreadystatechange', function(){
        if (document.readyState=='complete') callback();
    });
}

TEST.prototype.addEvent = function (event) {
    this.events.push(event);
}

TEST.prototype.clickEvent = function (e) {
    var pos = {
        x: e.pageX,
        y: e.pageY
    };

    var event = {
        type: 'click',
        data: pos,
        timestamp: new Date()
    };

    this.addEvent(event);
}

TEST.prototype.init = function () {
    document.addEventListener('click', this.clickEvent);
}

var test = new TEST();
test.ready(function(){
    test.init();
});

的jsfiddle：
https://jsfiddle.net/x2hLw009/

感谢任何帮助，谢谢！

修改

我将add添加到addEventListener：

document.addEventListener('click', this.clickEvent.bind(this));

但是当函数继续执行this.addEvent（）时，我收到新的错误：

TypeError: this.events is undefined

在这一行：

this.events.push(event);

Answer 1

它被打破的原因是因为this范围界定。＆＃34;这＆＃34;你的clickEvent函数内部与调用它的内容有关。

所以，既然文档正在调用它，＆＃34;这个＆＃34;可能会参考该文件。如果您想强制它引用当前对象，您将使用bind prototype.

document.addEventListener('click', this.clickEvent.bind(this));

如何访问事件侦听器中的类函数

1 个答案: