javascript 禁用和启用按钮类型的div上的单击事件

zqry0prt  于 2022-12-25  发布在  Java
关注(0)|答案(1)|浏览(164)

我正在用jQuery构建西蒙颜色游戏,我试图在游戏关闭或玩家点击错误颜色时禁用点击事件。我在网上读到了关于. prop("disalbe",真)和about. attr("disabled","disabled")的信息,但它们对我都不起作用。我使用的是div而不是button元素

<div class="container" id="container">
    <div class="row">

      <div type="button" id="green" class="btn green">

      </div>

      <div type="button" id="red" class="btn red">

      </div>
    </div>

    <div class="row">

      <div type="button" id="yellow" class="btn yellow">

      </div>
      <div type="button" id="blue" class="btn blue">

      </div>

    </div>

  </div>
allButtons.click(function() { // CLICK EVENT LISTENER
  const userChosenColour = this.id;
  userClickedPattern.push(userChosenColour);
  const userButton = $(`#${this.id}`);

  userButton.fadeTo(100, 0.1, function() { $(this).fadeTo(500, 1.0); });
  makeSound(this.id)

  if (checkAnswer(userClickedPattern.length)) { // CONDITIONS TO CHECK THE CURRENT CLICK
    if (userClickedPattern.length === gamePattern.length) {
      title.text('Success')
      setTimeout(function() {nextSequence()}, 1000);
    }
    return true;
  } else {
    // allButtons.attr('disabled',true);
    title.text('Wrong');
    makeSound('wrong');
    flashBackground();
    allButtons.prop('disabled', true);
    setTimeout(function() {resetGame()}, 500);
    return false;
  }
});

rn的结果是什么都没有发生。谢谢你的帮助!

pvcm50d1

pvcm50d11#

您可以将CSS属性pointer-events设置为none以防止单击。

allButtons.css('pointer-events', 'none'); // Disable clicks
allButtons.css('pointer-events', ''); // Re-enable

相关问题