JavaScript - 调用 class 函数 onclick
JavaScript - Call class function onclick
我想在触发 onclick 事件时从 class 调用 "member" 函数。 onclick 事件本身应该绑定在 class 内。这是我的:
var MyClass = function()
{
this.value = 'hello';
this.update = function()
{
console.log(this.value);
// Do some things with this.value
};
$('#button').click(this.update);
};
浏览器在更新函数中抱怨 this.value 未定义。
在处理程序函数中,this
指的是您单击的按钮。为了规避它,您可以将 this
引用存储到一个局部变量中,然后使用它。这种情况下最常用的变量名是 self
或 that
.
var MyClass = function() {
var self = this;
self.value = 'hello';
self.update = function() {
console.log(self.value);
// Do some things with self.value
};
$('#button').click(self.update);
};
或者正如其他人提到的,您可以明确地使用 MyClass.update
。
this
不是指 MyClass
.
var MyClass = function () {
var _this = this;
this.value = 'hello';
this.update = function () {
alert(_this.value);
// Do some things with this.value
}
this.click = function () {
$('#button').click(_this.update);
}
this.click();
};
var myClassOBJ = new MyClass();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="button">Click Me</div>
我想在触发 onclick 事件时从 class 调用 "member" 函数。 onclick 事件本身应该绑定在 class 内。这是我的:
var MyClass = function()
{
this.value = 'hello';
this.update = function()
{
console.log(this.value);
// Do some things with this.value
};
$('#button').click(this.update);
};
浏览器在更新函数中抱怨 this.value 未定义。
在处理程序函数中,this
指的是您单击的按钮。为了规避它,您可以将 this
引用存储到一个局部变量中,然后使用它。这种情况下最常用的变量名是 self
或 that
.
var MyClass = function() {
var self = this;
self.value = 'hello';
self.update = function() {
console.log(self.value);
// Do some things with self.value
};
$('#button').click(self.update);
};
或者正如其他人提到的,您可以明确地使用 MyClass.update
。
this
不是指 MyClass
.
var MyClass = function () {
var _this = this;
this.value = 'hello';
this.update = function () {
alert(_this.value);
// Do some things with this.value
}
this.click = function () {
$('#button').click(_this.update);
}
this.click();
};
var myClassOBJ = new MyClass();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="button">Click Me</div>