Функция щелчка выполняет текущий и предыдущий код функций

Question

Моя проблема в том, что функции .click похожи на «пузыри». Например, если я остаюсь на hand1, он возвращается к hitOrStay2 за hand2, что является правильным. Однако, если я нажимаю кнопку «хит», чтобы набрать hand2, он набрасывается как на hand1, так и на hand2, вместо hand2. Если я остаюсь на обоих hand1 и hand2, но попал на hand3, он попадает на все 3 руки.

Важное примечание. Да, у меня есть только 1 hitOrStay функция и 1 tableOptions функция, но она делала то же самое. После беспорядка, пытаясь исправить это, я решил иметь другую функцию для каждой из трех рук. Однако кнопки .hit, .stay html все те же, только один из них.

Если я не могу исправить это, я думаю, что мой единственный вариант - создать отдельные кнопки для нажатия и останова для каждой руки с разными идентификаторами/классами ...?

Вот мой код js/jQuery: (Я не ищу никого, чтобы представить рабочий пример, так как в этом есть слишком много. Я просто хотел бы знать, почему это происходит. способы идти о фиксации его. Etc.)

function hitOrStay(cards, hand, nHands) { 
    var x = addValueOfCards(cards); 
    var rt = hand.classhtml.toString(); 
    var choicemessage = $('<p class="choicemessage">You have ' + (x) + '. Do you want to hit or stay?</p>'); 
    if (x < 19) { 
     $(choicemessage).appendTo('.message'); 
     $('.hit, .stay').fadeIn(); 
     $('.hit').click(function() { 
      $('.hit, .stay').hide(); 
      cards.push(dealone(hand)); 
      $('.message').find('.choicemessage').detach(); 
      hitOrStay(cards, hand); 
     }); 
     $('.stay').click(function() { 
      $('.hit, .stay').hide(); 
      $('.message').find('.choicemessage').detach(); 
      if (nHands > 1) { 
       tableOptions2(nHands); } 
     }); 
     } 
    else { 
     $('<p>You Busted</p>').appendTo('.message'); 
     $(rt).find('.crd').detach(); 
     if (nHands > 1) { 
      tableOptions2(nHands); } 
    } 
} 

function hitOrStay2(cards, hand, nHands) { 
    var x = addValueOfCards(cards); 
    var rt = hand.classhtml.toString(); 
    var choicemessage = $('<p class="choicemessage">You have ' + (x) + '. Do you want to hit or stay?</p>'); 
    if (x < 19) { 
     $(choicemessage).appendTo('.message'); 
     $('.hit, .stay').fadeIn(); 
     $('.hit').click(function() { 
      $('.hit, .stay').hide(); 
      cards.push(dealone(hand)); 
      $('.message').find('.choicemessage').detach(); 
      hitOrStay2(cards, hand); 
     }); 
     $('.stay').click(function() { 
      $('.hit, .stay').hide(); 
      $('.message').find('.choicemessage').detach(); 
      if (nHands > 2) { 
       tableOptions3(nHands); } 
     }); 
     } 
    else { 
     $('<p>You Busted</p>').appendTo('.message'); 
     $(rt).find('.crd').detach(); 
     if (nHands > 2) { 
      tableOptions3(nHands); } 
    } 
} 

function tableOptions(nHands) { 
     hitOrStay(hand1.cards, hand1, nHands); 
} 

function tableOptions2(nHands) { 
     hitOrStay2(hand2.cards, hand2, nHands); 
} 

function tableOptions3(nHands) { 
     hitOrStay3(hand3.cards, hand3, nHands); 
} 

Answer 1

Вот как я получил его на работу

if (x < 19) { 
    $(choicemessage).appendTo('.message'); 
    $('.hit, .stay').fadeIn(); 
    $('.hit').on('click', function() { 
     $('.hit, .stay').hide().off(); 
     cards.push(dealone(hand)); 
     $('.message').find('.choicemessage').detach(); 
     hitOrStay(cards, hand); 
    }); 
    $('.stay').on('click', function() { 
     $('.hit, .stay').hide().off(); 
     $('.message').find('.choicemessage').detach(); 
     if (nHands > 1) { 
      tableOptions2(nHands); } 
    }); 
    } 

Answer 2

Вызов .click() не удаляет другие обработчики событий, ранее добавленные. Вы можете использовать .off() (предпочтительнее в новых версиях jQuery) или .unbind().

$('.hit').off('click'); 

Answer 3

Вы можете использовать unbind, чтобы удалить все click события, прежде чем добавлять новые события.

$('.hit').unbind('click'); 

этот фрагмент кода удаляет все события щелчка на этом элементе. Чтобы убедиться, что вы не отключаете другие события, всегда рекомендуется использовать их в пространстве имен и bind/unbind только события в этом пространстве имен.