在构造函数中添加事件侦听器
在构造函数中添加事件侦听器
提问于 2012-10-05 00:20:33
function Foo(elementId, buttonId) {
this.element = document.getElementById(elementId);
this.button = document.getElementById(buttonId);
this.bar = function() {dosomething};
this.button.addEventListener('click', function(e) {this.bar();}, false);
}
var myFoo = new Foo('someElement', 'someButton');我想在我的构造函数中添加事件侦听器，但它似乎不起作用。使用正确的语法，这是可能的吗？我总是挂断电话：
this.button.addEventListener('click', function(e) {this.bar();}, false);回答 3
Stack Overflow用户
回答已采纳
发布于 2012-10-05 00:23:38
您的this值将在构造函数中更改。您可以在选择器中保留一个引用，并使用该引用。
function Foo(elementId, buttonId) {
/*...*/
var self = this;
this.button.addEventListener('click', function(e) {self.bar();}, false);
}或者，不需要变量的更现代的解决方案是使用Function.prototype.bind。
function Foo(elementId, buttonId) {
/*...*/
this.button.addEventListener('click', this.bar.bind(this), false);
}.bind方法返回一个新的bar函数，其中的this值绑定到您传递给它的任何值。在这种情况下，它被绑定到来自构造函数的原始this。
Stack Overflow用户
发布于 2012-10-05 00:23:09
事件处理程序中的this是向其中添加事件的元素。
要访问外部this，需要将其存储在单独的变量中。
Stack Overflow用户
发布于 2012-10-05 00:23:30
单击处理程序中的this是按钮元素而不是对象，请使用变量引用对象，如var self = this;
function Foo(elementId, buttonId) {
var self = this;
this.element = document.getElementById(elementId);
this.button = document.getElementById(buttonId);
this.bar = function() {dosomething};
this.button.addEventListener('click', function(e) {self.bar();}, false);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12731528
复制相关文章
相似问题
腾讯云开发者
