单击后 class 名称上的 removeEventListener

Question

我正在尝试编写一些 Javascript 来获取数组中具有 class 的所有元素的点击事件。一切正常，但我只需要在满足 klikej() 函数中的第二个条件之前才需要它不可点击。单击事件触发后，带有 class 的项目不应可单击。我试过使用 removeEventListener and/or 和 PreventDefaults() 处理它，但没有任何效果。我只需要使用香草 Javascript - 不需要 jQuery 或其他任何东西。请你帮助我好吗？

    poleRandomKaret.forEach(karta => {
    document.querySelectorAll(`.${karta}`).forEach(element => {
        element.addEventListener('click', event => {
            console.log("klik");
            klikej(event, element);
        });
    });
});


function klikej(event, element) {
    let kliknuteKarty = document.querySelectorAll('[data-ovoce]');
    if (kliknuteKarty.length < 2) {
        element.setAttribute('data-ovoce', 'otoceno');
    }
    kliknuteKarty = document.querySelectorAll('[data-ovoce]');
    if (kliknuteKarty.length === 2) {
        kliknuteKarty[0].className === kliknuteKarty[1].className ? console.log("yes") : console.log("nope");
        kliknuteKarty.forEach(element => {
            element.removeAttribute("data-ovoce");
        });
    }
}

编辑： 在满足 klikej() 函数中的第二个条件之前，该项目不应可点击。我正在尝试使用 vanilla JS 做记忆游戏。函数 klikej() 为一个项目设置数据属性，一旦有两个项目具有相同的数据属性，它将在控制台 "yes" 中打印。如果它们是两个不同的数据属性，则它们需要再次可点击。

Answer 1

您可以添加一个名为 once 的选项作为 addEventListener 的第三个参数，使事件侦听器执行一次。

element.addEventListener('click', function(e){
    console.log('clicked'); // This will be executed once.
}, {once: true});

Answer 2

如果您删除了事件侦听器，并且需要再次侦听，则需要重新添加它或使用其他侦听器。如果我需要识别是否单击了某些内容，我会在侦听器回调中将属性添加到元素中，例如：

// before anything else we check if it was clicked before
if (element.clicked) {
    // do your magic when element was already clicked
} else {
    // do different magic with not yet opened element here
}
// after you did everything needed
// set the clicked attribute to true or false (if you need "unclick" it)
element.clicked = true;

这不是您问题的直接答案，但希望是对可能解决方案的另一种看法 - 如果我对您的理解正确，您可以在点击它时做一些事情，在尚未点击它时做其他事情，在这里您可以控制对于这两种情况。

单击后 class 名称上的 removeEventListener

removeEventListener on class name after one click

javascript

dom-events

addeventlistener

removeeventlistener