Question

我想用javascript检查按钮是否按特定顺序点击（我正在使用＆＃34; Simon Game＆＃34;）。订单是数字数组，每个数字对应于某个div（按钮）。但是我的代码有问题，而且它不起作用。

正确运行的代码执行此操作：

如果我单击右div-button并且如果我犯了错误则返回false，如果点击了所有序列，则返回true。

＆＃13;

  function getRandArray() {
    var array = [];
    for (var i = 0; i < 22; i++) {
      array[i] = Math.floor(Math.random() * 4 + 1);
    }
    return array;
  }
  var array = getRandArray();
  var elems = document.querySelectorAll('.bigButton');
  function checkSound(level) {
    var counter = 0;
    var checkArr = array.slice(0, level - 1);
    console.log(checkArr);
    for (var i = 0; i < elems.length; i++) {
      elems[i].addEventListener("click", function(e) {
        if (this.dataset.sound === checkArr[counter]) {
          counter++;
          console.log('right');
          return true;
        }
        return false;
      })
    }
  }
  checkSound(5);

＆＃13;

.bigButton {
  height: 25px;
  width: 35px;
  border: 2px solid #464646;
  margin: 1em;
  text-align: center;
  padding-top: 5px;
  display: inline-block;
}

＆＃13;

<div class="bigButton" id="greenButton" data-sound="1">1
</div>
<div class="bigButton" id="redButton" data-sound="2">2
</div>
<div class="bigButton" id="yellowButton" data-sound="3">3
</div>
<div class="bigButton" id="blueButton" data-sound="4">4
</div>

＆＃13;

Answer 1

尝试在===中替换==：

if (this.dataset.sound == checkArr[counter]) {

由于checkArr[counter]是一个数字，而this.dataset.sound是一个字符串，三等于===，因此也会比较该类型，因此永远不会达到这种情况。

或者您也可以使用parseInt()将字符串解析为整数，如：

if (parseInt(this.dataset.sound) === checkArr[counter]) {

希望这有帮助。

＆＃13;

function getRandArray() {
    var array = [];
    for (var i = 0; i < 22; i++) {
      array[i] = Math.floor(Math.random() * 4 + 1);
    }
    return array;
  }
  var array = getRandArray();
  var elems = document.querySelectorAll('.bigButton');
  function checkSound(level) {
    var counter = 0;
    var checkArr = array.slice(0, level - 1);
    console.log(checkArr);
    for (var i = 0; i < elems.length; i++) {
      elems[i].addEventListener("click", function(e) {
        if (this.dataset.sound == checkArr[counter]) {
          counter++;
          console.log('right');
          return true;
        }
        return false;
      })
    }
  }
  checkSound(5);

＆＃13;

.bigButton {
  height: 50px;
  width: 80px;
  border: 2px solid #464646;
  margin: 1em;
  text-align: center;
  padding-top: 15px;
}

＆＃13;

<div class="bigButton" id="greenButton" data-sound="1">1
</div>
<div class="bigButton" id="redButton" data-sound="2">2
</div>
<div class="bigButton" id="yellowButton" data-sound="3">3
</div>
<div class="bigButton" id="blueButton" data-sound="4">4
</div>
<br><br><br>

＆＃13;

检查是否按特定顺序JS单击了按钮

1 个答案: