个人中心
gpt4 book ai didi

javascript - Chrome : eventHandler ('click' , 函数)不适用于复选框

转载 作者：行者123 更新时间：2023-12-02 18:34:12 25 4
gpt4 key购买 nike

我正在为 google chrome 编写扩展。

我有一个 options.html，其中包含以下内容:

<html>
<head>
    <title>Test Options Menu</title>
    <script src="chromeoptions.js"></script>
</head>
<body>

<div id="options">
    <div id="form">
        <input type="checkbox" id="test">
        <div id ="testEvents" style="display:'none'">
            blabla
        </div>
    </div>
</div>
</body>
</html>

Chromeoptions.js 中有这样的内容:

function clicked(string) {
    console.log('clicked');
    if (document.getElementById(string).checked == true) {
        document.getElementById(string + 'Events').style.display = '';
    }
    else document.getElementById(string + 'Events').style.display = 'none';

}
document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('test').addEventListener('click', clicked('test'));
});

发生的情况是:第一次加载时，“click”事件处理程序会触发，导致 div“testEvents”消失。之后，当我切换复选框时什么也没有发生。事件处理程序不会触发。我使用“click”或“onchange”并不重要。

我还尝试将 scripttag 移动到 html 的底部，并将“click”事件处理程序放在“DOMContentLoaded”事件处理程序之外，但这也没有改变任何内容。

那么当我切换复选框时如何让事件处理程序触发？

最佳答案

addEventListener 的第二个参数必须是一个函数。您立即调用 clicked()，而不是传递调用它的函数。

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('test').addEventListener('click', function() {clicked('test')});
});

关于javascript - Chrome : eventHandler ('click' , 函数)不适用于复选框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17493982/

25 4 0
文章推荐： javascript - 在 Backbone.js 应用程序的 DOM 中将 subview 附加到父 View 之外
文章推荐： javascript - 如何使用字符串变量访问字符串数组？ JavaScript
文章推荐： javascript - 如果在一页 mvc 上登录，则从所有页面注销用户
文章推荐： php - Ajax 乡村城市选择菜单 onChange() 不起作用
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com