Estoy tratando de hacer un juego de trivia, con 10 preguntas aleatorias, pero tengo problemas con la acción de la siguiente pregunta. La acción de clic funciona para la primera pregunta siguiente, pero cada vez que hago clic en el botón, se ejecuta 2x y comienza a marcar cada respuesta como incorrecta. Intenté colocar la función trivia() fuera de la función API, pero luego el índice (i) no recibe el nuevo número. Probé preventDefault, pero parece que no funciona. Quiero pasar a la siguiente pregunta incluso si la respuesta es incorrecta.
$(document).ready(function() { $.get('https://opentdb.com/api.php?amount=10&category=17&type=boolean', function(dados) { //console.log(dados.results[i].question, dados.results[i].correct_answer) trivia(); function trivia() { let i = newNumber(); console.log(i, dados.results[i].question, dados.results[i].correct_answer) let right = dados.results[i].correct_answer; let wrong = dados.results[i].incorrect_answers; $('#question').html(dados.results[i].question); if (right == 'True') { $('#true').html(right) $('#true').on('click', function() { $(this).addClass('right') }) $('#false').html(wrong) $('#false').on('click', function() { $(this).addClass('wrong'); }) } else { $('#false').html(right) $('#false').on('click', function() { $(this).addClass('right') }); $('#true').html(wrong) $('#true').on('click', function() { $(this).addClass('wrong'); }) } $('#next').on('click', function(event) { event.preventDefault(); nextQ(); console.log('clicou proximo') trivia(); }) } }) }) function newNumber() { var numeros = []; while (numeros.length < 10) { var aleatorio = Math.floor(Math.random() * 10); if (!numeros.includes(aleatorio)) numeros.push(aleatorio); } return numeros[Math.floor(Math.random() * 10)] } function nextQ() { if ($('.answer').hasClass('right') || $('.answer').hasClass('wrong')) { if ($('.answer').hasClass('right') && $('.answer').hasClass('wrong')) { $('.answer').removeClass('right') $('.answer').removeClass('wrong') } if ($('.answer').hasClass('right')) { $('.answer').removeClass('right'); } if ($('.answer').hasClass('wrong')) { $('.answer').removeClass('wrong'); } } }