Question

我有这个javascript代码

function change (elem){
  if (x==1) elem.innerHTML = "1";
  else elem.innerHTML = "not 1";
}
var test = document.getElementById ("abc");
var x=1;

test.addEventListener ("click", change(test));

，html看起来像这样

<body>
  <div id="abc">a div</div>
</body>

如何在单击div元素之前阻止执行该函数？现在它只是自己更改innerHTML，我希望它等待点击监听器。

Answer 1

由于您立即立即调用，它会立即执行：

test.addEventListener ("click", change(test));

您需要传递一个函数，而不是函数调用的结果：

test.addEventListener("click",
  function() {
    change(test);
  }
);

Answer 2

您应该按照以下方式调用您的函数，例如：

test.addEventListener ("click", function(){change(test)});

Here is an example fiddle

Answer 3

test.addEventListener("click", function(){ change(this);});

Answer 4

由于括号，您正在立即执行函数change（）。

另外一种做法是通过引用传递函数并使用this来获取元素。

function change (){
  if (x==1) this.innerHTML = "1";
  else this.innerHTML = "not 1";
}
var test = document.getElementById ("abc");
var x=1;

test.addEventListener ("click", change);

声明侦听器时正在执行addEventListener函数

4 个答案: