Я строю игру tic-tac-toe, ниже приведен код, который я установил, чтобы установить флажок игрокаX, затем переключиться на игрока O. Используя $ .on ('click'), чтобы прослушать, в какую ячейку была нажата кнопка. Я получаю то, что, по моему мнению, происходит в пузырях. Каждый раз, когда нажимается одно окно, следующий блок производит экспоненциальную реакцию и так далее. Я пробовал e.stopPropogation, но он блокирует следующий ход.Событие jQuery bubbling
Как остановить реакцию наводнения?
function playX() {
$box.on('click', function (e) {
console.log(this);
var a = e.target.dataset.index;
b[a] = 'X';
$(this).text('X');
playO();
})
}
function playO() {
$box.on('click', function (e) {
console.log(this);
var b = e.target.dataset.index;
b[b] = 'O';
$(this).text('O');
playX();
})
}
Вот ссылка на все это http://jsfiddle.net/shallak/fdctcvdt/
(Я также использую рамки CSS, материализовать)
вы не должны быть привязку события каждый раз, когда playX или playO называется .. каждый раз, когда другой обработчик зарегистрирован, который вызывает «экспоненциальный» поведение вы столкнулись , Самое быстрое решение вашей проблемы - использовать «$ box.one (...)» вместо «$ box.on (...)» (это будет связывать событие один раз и очистить обработчик) –
Как @elad. chen заявил, что вам нужно всего лишь связать событие click один раз. более того, лучше иметь 1 функцию и просто изменить код, если это X или O. – Saar