JS onclick功能

Question

如果我有以下功能：

function init() {
  var btn = document.getElementById('sort-btn');
  btn.onclick = btnHandle();
}

btnHandle()在没有单击按钮的情况下执行。 它会在页面加载后立即执行。

但如果代码是：

function init() {
  var btn = document.getElementById('sort-btn');
  btn.onclick = btnHandle;
}

它正常执行。

这两者有什么区别？

Answer 1

使用btnHandle()时，会立即调用函数，但使用btnHandle，会传递对此函数的引用，该函数将在单击按钮时执行。

Answer 2

btnHandle计算为变量的值。

btnHandle()获取变量的值，将其作为函数调用，并根据函数的返回值进行求值。

btn.onclick = btnHandle;将该功能分配给onclick。

btn.onclick = btnHandle();指定将函数调用onclick时获得的返回值。

Answer 3

您应该为onClick指定一个函数，而不是值。

在您的代码中：

btn.onclick = btnHandle（）; 页面运行时将执行btnHandle（），结果将分配给onClick。

btn.onclick = btnHandle; btnHanle是一个函数，单击按钮时将调用它。