Question

问题：

此记忆游戏的代码一直有效，直到我单击“重新启动”为止（看起来确实如此），但随后事件监听器似乎不再起作用。我有一种预感，这是由于我正在重新启动游戏而进行的递归调用，但是我不明白为什么。有人可以向我解释一下吗？

搜索后，有很多关于事件监听器未触发的问题，但它们的发生是由于递归调用以外的原因。

JSFiddle上的代码

对不起，JS还这么长，在不破坏代码的情况下，我已尽我所能删除并简化了很多。

@WorkerThread
Flowable<Integer> updateMovies(Helper help) {
    return movieDao.getMovies()
        .firstOrError()
        .flatMapIterable(movies -> movies)
        .flatMap(movie -> { ... })
        .map(movie -> { ... });
}

Answer 1

事件侦听器将附加到旧的呈现DOM元素上，并且在按重新启动时不会重新分配给新呈现的元素...
因此，每次重新启动游戏时都必须重新附加事件侦听器...
建议的解决方案是将'Attach事件代码部分与函数包装在一起'，并在每次启动游戏时调用此函数：

function attachEvents() {
    const cardDeck = document.querySelectorAll('.card');
    cardDeck.forEach(function(card){
        card.addEventListener('click', function(e){
        card.classList.add('open', 'show');

        openingCards(card);
        });
    });
}

JSFiddle

递归调用重新启动代码后，Javascript事件侦听器未触发

1 个答案: