如何在自定义 javascript 对象中设置标签 onclick？ [复制]答案

【问题标题】：How to set tags onclick in custom javascript object? [duplicate]如何在自定义 javascript 对象中设置标签 onclick？ [复制]
【发布时间】：2018-02-23 02:01:29
【问题描述】：

我对 javascript 对象引用感到困惑。如果我有这样的标签：

<button id='myButton'>Hello</button>

我在 javascript 中创建了一个自定义类：

function myClass(){
    this.myButton= document.getElementById('myButton');

    this.myButton.addEventListener("click",function(){
        alert(this.myButton.innerHTML);
    });
}

我对这个函数的期望是，它会显示带有“Hello”文本的警报弹出窗口，但我得到的是：

TypeError: this.myButton is undefined

然后，我尝试将功能更改为：

function myClass(){
    this.myButton= document.getElementById('myButton');

    this.myButton.addEventListener("click",function(){
        alert(this.myButton);
    });
}

我得到的是一个提示“未定义”的弹出窗口。有什么想法可以解决我的问题吗？

【问题讨论】：

标签： javascript html function javascript-objects

【解决方案1】：

你应该使用

function myClass(){
  this.myButton= document.getElementById('myButton');
  var self = this;

  this.myButton.addEventListener("click",function(){
    alert(self.myButton);
  });
}

因为您声明的内联函数的this 引用了window 对象。

【讨论】：

它有效。我以前不知道。谢谢。