Как убедиться, что моя функция запускается только один раз за клик

Question

$('#myButton').click(function() {
    $('#buttonOne').click(function() {
      if(getOneOrTwo() === "one") {
        $('.firstObject').css('visibility', 'hidden');
        $('.secondObject').css('visibility','visible');
      } else {
          alert("Sorry, wrong guess.");
      }
     }
     
     $('#buttonTwo').click(function() {
      if(getOneOrTwo() === "two") {
        $('.firstObject').css('visibility', 'hidden');
        $('.secondObject').css('visibility','visible');
      } else {
          alert("Sorry, wrong guess.");
      }
  });
  
  

У меня на экране несколько игральных карт, над которыми у всех алмазы.Сначала у меня спрятаны все бриллианты.Когда нажата кнопка «Пуск», я хочу, чтобы ромб появился на первой карточке, и было выбрано случайное число, где <0,5 установлено равным красному, а> 0,5 равно черному.Затем пользователь угадывает, будет ли он красным или черным, нажимая черную или красную кнопку.Если они угадают правильно, ромб над 1-й картой должен быть скрыт, а бриллиант появится над второй картой, чтобы указать на их прогресс в игре.Если они не правы, то должно появиться предупреждение о том, что они не правы.Кажется, она работает нормально для красной кнопки, но черная кнопка заставляет предупреждение продолжать всплывать каждый раз, когда я закрываю предупреждение до тех пор, пока оно не станет правильным, как если бы кнопка постоянно нажималась до тех пор, пока она не будет правильной.

Answer 1

Обычно вы не должны устанавливать обработчик кликов внутри другого обработчика кликов. В большинстве случаев это запах кода, как здесь.

Вы захотите, чтобы кнопка «Пуск» выбрала цвет (сделайте выбор), но не более того; по крайней мере, не назначайте обработчик щелчка другим кнопкам здесь. Это может работать, но это просто, когда вы определяете обработчики кликов за пределами этого конкретного обработчика щелчков «Пуск».

Обработчики красного / синего щелчков должны , а не выбирать цвет (снова), потому что тогда пользователь может несколько раз нажать одну и ту же кнопку, пока она не станет правильной. Кажется более логичным, что выбор производится только по нажатию кнопки «Пуск», после чего происходит угадывание , что конкретной карты произойдет.

Так что храните выбранную карту где-нибудь. Как это:

var selected = null; // No selection yet
$('#buttonOne, #buttonTwo').hide(); // Initially hide the guessing buttons.

$('#myButton').click(function() {
    selected = getOneOrTwo();
    $('#buttonOne, #buttonTwo').show(); // Now that we have a selection, allow guessing
});

$('#buttonOne').click(function() {
    if (selected === "one") {
        // here do what ever you want to do when the guess is right
    } else {
        alert("Sorry, wrong guess.");
    }
});

// Similarly for the other button