Button.onclick自动触发,以后不会再触发

Button.onclick automatically triggers, then will not trigger again

我有一个脚本,我用它来尝试一次只显示网页的一部分。

function showMe(id){ clearPage(); changeDisplay(id, "block"); console.log(id)}

目前,我正在使用按钮来更改显示的部分。

var aBtn = document.getElementById("a-btn");
var otherBtn = document.getElementById("other-btn");
aBtn.onclick=showMe("a-btn-section-id");
otherBtn.onclick=showMe("other-btn-section-id");

但是,当我加载页面时,会发生以下情况:

  1. 我看到每个按钮附带的功能在控制台中按顺序激活一次。
  2. 该页面拒绝响应进一步的按钮输入。

用控制台测试显示 showMe() 和它调用的函数仍然可以正常工作。我确定我犯了一个非常基本的初学者错误(希望这就是为什么我在 Google/search Whosebug/read 事件处理文档时找不到这个问题),但我在那个错误的损失。为什么我的脚本假设我的按钮在加载时被点击,为什么它不允许我再次点击它们?

您正在调用函数并将值赋给 onclick 属性 而不是附加函数,请尝试将 onclick 属性 定义为:

aBtn.onclick=function(){showMe("a-btn-section-id");};
otherBtn.onclick=function(){showMe("other-btn-section-id");};

尝试以下 jsfiddle:

function showMe(id){ // some stuff..
  console.log(id)
}

var aBtn = document.getElementById("a-btn");
var otherBtn = document.getElementById("other-btn");
aBtn.onclick=function(){showMe("a-btn-section-id");};
otherBtn.onclick=function(){showMe("other-btn-section-id");};
<input type="button" value="a-btn" id="a-btn"/>
<input type="button" value="other-btn" id="other-btn"/>

希望这对您有所帮助,