En este caso tengo una función que se encarga de cambiar el texto de un párrafo y una imagen con cada click que el usuario haga. En este caso, targetxt es la clase del <p> y targetfto es la clase de la <img>. Texto es un array con el texto que será reemplazado con cada click y logo es un array con la source de cada imagen que será reemplazada con cada click. Success es una función que se ejecuta cuando ya no queda más texto que imprimir en pantalla.
Código:
Dentro de la función success yo sigo desarrollando mi código. Por ejemplo, al llegar al límite de texto, la función success se encarga de añadir una clase CSS que cambia la posición de la imagen en la pantalla.function textTer(targetxt,targetfto,texto,logo,success){ num = 0; $(document).click(function(){ if(num<texto.length){ $("."+targetxt).text(texto[num]); $("."+targetfto).attr("src",logo[num]); num++; } else{ return success(); } }); }
Código:
Hasta ahí todo funciona perfecto, pero luego de hacer este cambio, requiero utilizar la función nuevamente para seguir cambiando el texto de mi párrafo con cada click. Para ello, dentro de success, repito el llamado a la misma funcióntextTer("dialogoIntroJuego","logoIntroJuego",["HEY!!","¿TÚ ERES "+localStorage.getItem("nombreniño").toUpperCase()+"?", "WOW, ME HAN HABLADO MUCHO DE TI", "NECESITO QUE ME AYUDES CON UN PROBLEMA", "PERO ANTES, ¿QUÉ NOMBRE ME PONDRÍAS?"], ["C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz2.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz3.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz6.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz5.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz2.png"],function(){ console.log("hola"); $(".checkIntroJuego").addClass("introScaleIntroJuego"); $(".centrarLogoIntroJuego").addClass("moverLogoIntroJuego"); $(".centrarDialogoIntroJuego").addClass("moverDialogosIntroJuego");
Código:
El problema viene en que ahora estoy ejecutando la misma función dos veces simultáneamente, por lo tanto, el resultado es distorsionado y se mezcla el texto de la primera llamada a la función con el texto de la segunda llamada.textTer("dialogoIntroJuego","logoIntroJuego",["HEY!!","¿TÚ ERES "+localStorage.getItem("nombreniño").toUpperCase()+"?", "WOW, ME HAN HABLADO MUCHO DE TI", "NECESITO QUE ME AYUDES CON UN PROBLEMA", "PERO ANTES, ¿QUÉ NOMBRE ME PONDRÍAS?"], ["C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz2.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz3.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz6.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz5.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz2.png"],function(){ console.log("hola"); $(".checkIntroJuego").addClass("introScaleIntroJuego"); $(".centrarLogoIntroJuego").addClass("moverLogoIntroJuego"); $(".centrarDialogoIntroJuego").addClass("moverDialogosIntroJuego"); textTer("dialogoIntroJuego2","logoIntroJuego2",[nombrelapiz+", ESE NOMBRE ES GENIAL!!","MUY BIEN, VAYAMOS CON EL PROBLEMA","HD","HE"], ["C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz6.png", "C:\\Users\\Himad A\\Desktop\\Juego de Matemática 2.0\\Imágenes\\lapiz5.png"],function(){ console.log("HEY"); })
Lo que quisiera hacer es encontrar una forma de que al ejecutar success(), se inhabilite la función texTer(cabe recordar que esta se repite con cada click que el usuario haga en el documento) hasta que sea llamada nuevamente, de modo que solo se pueda ejecutar simultáneamente una vez.
Espero que me haya podido explicar bien, muchísimas gracias por tomarse su tiempo en leer mi duda!!