Javascript”;onmousemove”;事件无法与类一起使用

Javascript "onmousemove" event not working with classes

本文关键字：一起 onmousemove 事件 Javascript      更新时间：2023-09-26

我真的不知道如何在标题中表达这一点，但我正在尝试创建一个包含所有事件函数的类，但我遇到了奇怪的问题。

以下是该问题的一些模拟代码。

class Mouse{
    constructor(){
        this.x = 0;
        this.y = 0;
    }
}
class MainClass{
    constructor(){
        this.mouse = new Mouse();
    }
    updateMouse(event){
        this.mouse.x = event.clientX;
        this.mouse.y = event.clientY;
    }
}
var mouse;
var main;
window.onload = function(){
    main = new MainClass();
    document.onmousemove = main.updateMouse;
}

我遇到的主要问题是，当我运行它时，它会返回错误"无法设置未定义的属性'x'"，这很奇怪，因为当我遍历程序main.mouse.x时，直到document.onmousemove行。

如果我将updateMouse（）函数移到Mouse类中，并改为执行以下操作：

mouse = new Mouse();
document.onmousemove = mouse.updateMouse();

然后它就工作了，但是在我试图编写的ACTUAL程序中，updateMouse（）方法需要调用MainClass中的其他方法，所以我不能这样做。

您必须使用

window.onload = function(){
    main = new MainClass();
    document.onmousemove = main.updateMouse.bind(main); // bound function
};

试试看。如果不绑定函数，它会将"this"视为自身（文档对象）。

相关文章：