Question

我正在制作一个西蒙游戏，类似于你在这里可以找到的游戏：https://codepen.io/Em-Ant/full/QbRyqq/。下面的相关代码段和我到目前为止编写的所有代码都可以在此处找到：https://github.com/JamesRiall/Simon-Game/blob/master/js/index.js

基本上，该计划正在添加＆＃34;红色＆＃34;，＆＃34;绿色＆＃34;，＆＃34;蓝色＆＃34;或＆＃34;黄色＆＃34;只要点击游戏中的相关面板，就可以使用clickInRound数组。然后我可以使用这个clicksInRound数组来检查玩家应该遵循的顺序，或者什么也不做（如果选择正确但他们还没有完成整轮），将它们移动到下一个级别（如果选择是正确并且他们已完成该轮次序列）或重置游戏（如果错误）。

我的问题是，当我玩游戏时，clicksInRound数组有太多的值被推送到它。下面是当我玩游戏并点击黄色两次时clickInRound的console.log的结果（黄色是生成序列中的第一种颜色）：

[＆＃34;黄色＆＃34;]

[＆＃34;黄色＆＃34;，＆＃34;黄色＆＃34;]

我想要的输出只是＆＃34;黄色＆＃34;对于前两行（第一次单击我的选择在第一轮中为黄色，然后第二次单击我的选择仅在第二轮中为黄色）。但是，我得到了第三行[＆＃34;黄色＆＃34;，＆＃34;黄色＆＃34;]这就是我的所有支票。如果我在第二轮中点击黄色然后是蓝色，那么当我想要输出时，我的clicksInRound数组将是[＆＃34;黄色＆＃34;，＆＃34;黄色＆＃34;，＆＃34;蓝色＆＃34;]是[＆＃34;黄色＆＃34;，＆＃34;蓝色＆＃34;]

任何人都可以通过下面的代码段或GitHub上的完整代码诊断问题吗？（对不起有些不完整的代码片段，如果不复制整个程序，很难在这里发布相关的片段）。

谢谢！

$(".game-button").click(function() {
  if (sequencePlaying === false && running === true) {
    if ($(this).is("#red")) {
      playRedInSequence();
      clicksInRound.push("red");
      whereInRound++;
      checkClickIsCorrect();
    } else if ($(this).is("#blue")) {
      playBlueInSequence();
      clicksInRound.push("blue");
      whereInRound++;
      checkClickIsCorrect();
    } else if ($(this).is("#yellow")) {
      playYellowInSequence();
      clicksInRound.push("yellow");
      whereInRound++;
      checkClickIsCorrect();
    } else if ($(this).is("#green")) {
      playGreenInSequence();
      clicksInRound.push("green");
      whereInRound++;
      checkClickIsCorrect();
    }
  }
});

Answer 1

问题似乎不在您的JavaScript代码中。在您的HTML中，您尚未关闭line 28上的div。

<table style="margin-left: auto; margin-right: auto" id="game">
        <tr>
           <td>
              <div class="game-button" id="green"></div>
           </td>
           <td>
              <div class="game-button" id="red"><div> <!-- PROBLEM PROBLEM!! -->
           </td>
        </tr>
      <tr>
           <td>
              <div class="game-button" id="yellow"></div>
           </td>
           <td>
              <div class="game-button" id="blue"></div>
           </td>
        </tr>
   </table>

如果你关闭div并运行代码，它似乎按预期工作，虽然我不完全理解游戏。在这里，我用你的github代码创建了一个jsFiddle并进行了修正。它似乎工作。

Javascript / Jquery值推送不止一次

1 个答案: