随机播放功能不适用于点击按钮

Question

我正在尝试使用 vanilla js 创建一个记忆卡游戏。我有一个随机播放功能，我想在重置游戏按钮时调用它，但它不起作用。

这是我目前拥有的：

var imageList = [
        {
            name: 'image_1',
            id: 1
        },
        {
            name: 'image_2',
            id: 2
        },
        {
            name: 'image_3',
            id: 3
        },
        {
            name: 'image_4',
            id: 4
        }
    ],
    card = [],
    appendToBoard = document.getElementById('cardTable');

function shuffle(array) {
  //some code here
}

function createCardDeck() {
    shuffle(imageList); // calling shuffle(imageList)
   //some code here
 }

以上所有工作，但是当我在 btnReset 上调用 shuffle(imageList) 时，它什么都不做

document.getElementById('btnReset').addEventListener('click', function(event) {
    event.preventDefault();
    shuffle(imageList);
}, true);

https://jsfiddle.net/rmbor/qnzaope7/

如有任何建议，我们将不胜感激。谢谢

Answer 1

做两件事：

将var card = '';添加到createCardDeck函数以在添加标记之前清除它：

function createCardDeck() {
    shuffle(imageList);
    var card = '';
    for (var i = 0; i < imageList.length; i++) {...}
}

在您的 addEventListener 函数中将 shuffle(imageList) 替换为 createCardDeck()：

document.getElementById('btnReset').addEventListener('click', function(event) {
    event.preventDefault();
    createCardDeck();
}, true);

查看演示 - Fiddle.

随机播放功能不适用于点击按钮

Shuffle function not working on click button

javascript

addeventlistener