He programado un sistema de puntos, después de canjear con éxito doy con isset($succesMsg) un mensaje de que fue exitoso.
Ahora quiero mostrar una pequeña animación usando JavaScript, pero no funciona.
Mi código PHP
$succesMsg= "<div class='body-overlay' id='body-overlay'></div> <div class='overlay' style='display: none;'><h1><span>+ {$codeCoins['coins']}</span></h1></div>Mi botón HTML es:
<input type="submit" name="code" class="btn btn-primary w-100" value="CODE EINLÖSEN">Mi código JavaScirpt es
<script> $(document).ready(function(){ $(".overlay").hide(); $(".btn btn-primary w-100").click(function(){ $(".overlay").show(); setTimeout(function() { $('.overlay').fadeOut(); }, 3000); }); }); </script>Cuando hago clic en canjear, veo en el código fuente que los campos div están configurados (superposición de cuerpo y superposición) pero la animación no funciona.
Si lo intento sin la migración de PHP funciona, pero desafortunadamente no me trae nada.
No puedo encontrar el error, estoy buscando todo el tiempo.
Dos errores que puedo ver en su código:
$(".btn btn-primary w-100") Siempre que desee agregar cualquier evento utilizando múltiples clases de un solo elemento html. Debe estar sin espacio también con punto ( . ).
Explicando: .btn btn-primary w-100 elementos anidados con las clases mencionadas. Como si tuvieras elementos html son como
<div class='btn'> <div class='btn-primary' > <div class='w-100'> </div> </div> </div>cambiarlo a:
.btn.btn-primary.w-100$succesMsghas escrito un código html en él. Que debe cargarse primero antes del código javascript.
Haga lo siguiente: mantenga su html listo solo en html y configure varibale verdadero o falso en php. Y puedes verificar esa variable en el script. Si es cierto .show() o bien .hide()
Nota: Isset verifica si una variable está configurada y no es NULL solamente.