如何通過按鈕在Javascript中調用方法（使用此方法）？

Question

在javascript中，從按鈕調用函數很容易：

b.onclick = f;

也可以通過按鈕調用方法：

Myclass.prototype.m = function() {
    var t = this;
    b.onclick = t.f;
}

但是我們想通過一個按鈕通過另一個函數來調用類的方法。 有什么方法可以在不傳入原始對象的情況下執行此操作？

這是無效的代碼。 這是在按鈕的上下文中解釋的。

<!DOCTYPE html>
<html>
<body>
</body>
<script>
function A() {}
A.prototype.e = function() {
  console.log("bar");
}

A.prototype.f = function() {
  console.log("foo!");
  this.e();
}

A.prototype.g = function() {
  var b = document.createElement("button");
  b.innerHTML = "say foo!";
  b.onclick = this.f;
  document.getElementsByTagName("body")[0].appendChild(b);
}

var a = new A();
a.g();

</script>
</html>

Answer 1

由於流程中斷，您應該綁定以下內容

<!DOCTYPE html>
<html>
<body>
</body>
<script>
function A() {}
A.prototype.e = function() {
  console.log("bar");
}

A.prototype.f = function() {
  console.log("foo!");
  this.e();
}

A.prototype.g = function() {
  var b = document.createElement("button");
  b.innerHTML = "say foo!";
  b.onclick = this.f.bind(this)
  document.getElementsByTagName("body")[0].appendChild(b);
}

var a = new A();
a.g();

</script>
</html>

Answer 2

使用Function.prototype.bind將this關鍵字的上下文更改為您a實例

<!DOCTYPE html>
<html>
<body>
</body>
<script>
function A() {}
A.prototype.e = function() {
  console.log("bar");
}

A.prototype.f = function() {
  console.log("foo!");
  this.e();
}

A.prototype.g = function() {
  var b = document.createElement("button");
  b.innerHTML = "say foo!";
  b.onclick = this.f.bind(this);
  document.getElementsByTagName("body")[0].appendChild(b);
}

var a = new A();
a.g();

</script>
</html>

如何通過按鈕在Javascript中調用方法（使用此方法）？

問題描述

2 個解決方案

解決方案1
1 2015-08-18 18:50:38

解決方案2
1 已采納 2015-08-18 19:06:32

如何通過按鈕在Javascript中調用方法（使用此方法）？

問題描述

2 個解決方案

解決方案1 1 2015-08-18 18:50:38

解決方案2 1 已采納 2015-08-18 19:06:32

解決方案1
1 2015-08-18 18:50:38

解決方案2
1 已采納 2015-08-18 19:06:32