我只选中了一个复选框，但调用了附加到其他复选框的另一个单击侦听器。我不认为这是事件冒泡的典型案例。我该如何解决这个问题？我已经检查过这是否与事件冒泡有关。但我不这么认为，因为我的输入标签是水平的。弹窗.html <!DOCTYPE html><html> <head> </head> <body> <h3>Input game title to search metacritic score!</h3><br> <p>Press the "Enter" key inside the input field to trigger the button.</p> <input id="gameTitle" value="Example : "Gears 5""> <input type="checkbox" name="Pc" id="pcCheck">PC<br> <input type="checkbox" name="Ps4" id="ps4Check">PS4<br> <input type="checkbox" name="Xbox" id="xboxCheck">XBOX<br> <input type="checkbox" name="Switch" id="switchCheck">SWITCH<br> <button id="confirmBtn">Confirm</button> <p id = "content"></p> <script src="popup.js"></script> </body></html>弹出窗口.jsvar dict = {};dict["confirmBtn"] = document.getElementById("confirmBtn");dict["pcCheck"] = document.getElementById("pcCheck");dict["ps4Check"] = document.getElementById("ps4Check");dict["xboxCheck"] = document.getElementById("xboxCheck");dict["switchCheck"] = document.getElementById("switchCheck");document.addEventListener('DOMContentLoaded', function() { dict["confirmBtn"].addEventListener("click", confirmBtnEvent); dict["pcCheck"].addEventListener("click", CheckEvent("pcCheck"),{capture:true}); dict["ps4Check"].addEventListener("click", CheckEvent("ps4Check"),{capture:true}); dict["xboxCheck"].addEventListener("click", CheckEvent("xboxCheck"),{capture:true}); dict["switchCheck"].addEventListener("click", CheckEvent("switchCheck"),{capture:true});});我希望在单击相应的复选框时调用一个特定的事件侦听器。
1 回答
隔江千里
TA贡献1906条经验 获得超10个赞
你没有addEventListener正确调用。参数应该是函数引用，而不是调用函数的结果。并且选项需要是addEventListener.
dict["pcCheck"].addEventListener("click", function() {
CheckEvent("pcCheck");
},{capture:true});
但是，如果您CheckEvent稍作更改，则可以将其简化为：
dict["pcCheck"].addEventListener("click", CheckEvent, {capture:true});
当一个事件监听器被调用时，this被设置为事件的目标，所以你可以只this在函数内部使用，而不是document.getElementById()用参数调用。
添加回答
举报
0/150
提交
取消