addEventListener 在循环中无法正常工作

Question

let showHidePassword = function(selector){
    let elem = document.querySelectorAll(selector);
    elem.forEach(item => {
        item.addEventListener("click", function(e){
            e.preventDefault();
            let target = document.getElementById(item.getAttribute("data-target"));
            if(target.type == "password") {
                target.type = "text";
                item.classList.add("shown");
            }else{
                target.type = "password";
                item.classList.remove("shown");
            }
        });
    });
}

我有这样的代码。它可以工作，但如果 elem 不是偶数，即页面上有 1 个或 3 个。对于偶数，它不起作用，因为循环会经过两次，因此会同时添加和删除类。

我尝试了我所知道的所有可能的变体，但它不起作用。我的问题是什么？

Answer 1

这个 stackoverflow 帖子似乎回答了您的问题：addEventListener 使用 for 循环并传递值

如果您仍有问题，请告诉我！