Первая проблема с вашим кодом заключается в том, что он никогда не выполняется.Вам нужно настроить запуск своего кода, но поскольку вы никогда не выполняете функцию вне самой функции, она никогда не настраивает наблюдателя.
Вы можете сделать это так:
$(document).ready(function () {
wrongGuess();
});
К сожалению, код, который вы написали, не правильно делает то, что вам нужно, поэтому я предоставил вам следующее решение:
Сначала я настроил некоторый базовый HTML, чтобы проиллюстрировать плохое ихорошие буквы:
<h2>wrong</h2>
<button id="a">A</button>
<button id="b">B</button>
<h2>correct</h2>
<button id="p">P</button>
<button id="s">S</button>
<hr>
<h1 id="torso">torso</h1>
<h1 id="right-arm">right arm</h1>
<hr>
wrong count: <span id="wrong">0</span>
Затем я настроил функцию, чтобы изначально скрыть все части тела:
function hideAllBodyParts() {
var bodyPartsSelector = bodyPartsArray.join(', ');
$(bodyPartsSelector).hide();
}
Вы не можете передать массив в jQuery как селектор, он долженбудет строкой, то есть '#a, #b' вместо ['#a', '#b'].
Тогда ваша основная функция, которая показывает одну часть тела за раз и увеличивает неправильный счет:
function watchForWrongGuesses() {
// Your selector needs to be a string, e.g. '#a, #b' not an array ['#a', '#b']
var wrongLettersSelectors = wrongLettersArray.join(', ');
$(wrongLettersSelectors).on('click', function () {
// Choose one body part and show it
var bodyPart = bodyPartsArray.pop();
$(bodyPart).show();
// Increment wrong count
wrongAmount++;
$('#wrong').text(wrongAmount);
});
}
Затем,последняя, но самая важная часть - связать его при загрузке документа:
$(document).ready(function () {
hideAllBodyParts();
watchForWrongGuesses();
});
Этот метод изначально скрывает все части тела, а затем настраивает наблюдатель для нажатий кнопки.
Решение: https://codepen.io/tinacious/pen/xmOgJj