1
function startGame() {
    // const circlesList = document.querySelectorAll('.circle')
    board.addEventListener('click', (event) => {
        if ( event.target.classList.contains('circle') )
        {
            alert (gameCounter)
            let element = event.target.getAttribute('data-num')
            console.log (':', gameCounter, element)
            if ( gameCounter == element){
                event.target.style.backgroundColor = 'green'
                scoreCount.innerText = ++score

                // if (gameCounter == circlesCount) {
                // console.log ('+', gameCounter, element)
                gameCounter++
                if ( circlesCount - gameCounter == 0) {
                    console.log ('goood', gameCounter, circlesCount)
                    board.innerHTML = ''
                    circlesCount = circlesCount + 1
                    gameCounter = 0
                    createCircle(circlesCount)
                } 

            }else {
                // console.log ('-', gameCounter, element)
                // event.target.style.backgroundColor = 'red'
            }
            
        }        
    })
      
}

В этом участке, после 1й итерации, по нажатию на круг addEventListener (а может и не он) срабатывает n раз , где n это текущая итерация. alert замечательно это демонстрирует!

Смысл игры в том что бы последовательно повторять появления кружков нажимая на них.

Протестировать можно здесь https://jsfiddle.net/ctacua/0w7tmrgd/1/

1
  • Вы вешаете обработчик нажатия в функцию, которая вызывается каждый раз, как начинается новый уровень. Соответственно на каждом новом уровне создается новый обработчик, а те, которые существовали -- никуда не деваются. Вынесите назначение обработчика в глобальную область, а функцию startGame просто уберите.
    – rusgeli
    24 окт 2022 в 6:22

2 ответа 2

1

Что бы решить проблему сходу, код листнера вынесете в функцию, тогда можно будет слушатель удалять. Данное поведение обусловлено тем, что вы каждый раз добавляете новый слушатель, не удаляя предыдущий.

Однако лучший вариант, это посмотреть, где и как вы вызываете функцию startGame. Ее необходимо вызывать только один раз при запуске, что бы не заниматься постоянной установкой и удалением слушателей.

function listner(event) {
    if ( event.target.classList.contains('circle') )
        {
            alert (gameCounter)
            let element = event.target.getAttribute('data-num')
            console.log (':', gameCounter, element)
            if ( gameCounter == element){
                event.target.style.backgroundColor = 'green'
                scoreCount.innerText = ++score

                // if (gameCounter == circlesCount) {
                // console.log ('+', gameCounter, element)
                gameCounter++
                if ( circlesCount - gameCounter == 0) {
                    console.log ('goood', gameCounter, circlesCount)
                    board.innerHTML = ''
                    circlesCount = circlesCount + 1
                    gameCounter = 0
                    createCircle(circlesCount)
                } 

            }else {
                // console.log ('-', gameCounter, element)
                // event.target.style.backgroundColor = 'red'
            }
            
        }  
}

function startGame() {
    // const circlesList = document.querySelectorAll('.circle')
    board.removeEventListener('click', listner);
    board.addEventListener('click', listner);
      
}
1
  • Да, точно, что то я забыл это дописать... Поправил
    – SwaD
    24 окт 2022 в 9:22
0

у тебя при каждом попадании на круг вызывается alert, он считает gameCounter, а так как он у тебя повышается при каждом попадании, следовательно и вызывается n-попаданий раз.

3
  • АЛЕРТ всего лишь индикатор. Убрав его это не решит проблему.
    – Stas
    24 окт 2022 в 5:37
  • значит я глупый, просто через алерт неудобно же, каждый раз закрывать его придется, чтобы дальше на кружочк клачать
    – dxsya
    24 окт 2022 в 5:40
  • алерт это дебаг, который в отличае от консоль.лог показал мне проблему наглядней!
    – Stas
    24 окт 2022 в 6:33

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.