Así que acabo de hacer una página HTML simple en la que se ejecuta un script JS cuando se carga la página. Pero el problema es que simplemente se vuelve infinito después de pedir la contraseña. Traté de encontrar algunas soluciones pero no pude hacer lo mismo. Por favor ayuda. A continuación se muestra el código.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Alert test</title> </head> <body onload="alert()"> <script> function alert() { var uname, pass, corr_uname = "admin", corr_pass = "admin"; while(!uname) { uname = prompt("Enter Username: "); } while(!pass) { pass = prompt("Enter Password: "); } if((uname == corr_uname) && (pass == corr_pass)) { alert("Access Granted!!"); } else { alert("Access Denied!"); alert(); } } </script> <h1>Welcome!</h1> </body> </html>Lo gracioso es que cuando ejecuto el mismo código (JS se ejecuta después de hacer clic en un botón) en W3Schools, ¡simplemente funciona bien!
El problema es que ha creado una función llamada alert que ya existe en javascript, por lo que la está llamando de forma recursiva e infinita.
Corrección de la solución
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Alert test</title> </head> <body onload="alert2()"> <script> function alert2() { var uname, pass, corr_uname = "admin", corr_pass = "admin"; while(!uname) { uname = prompt("Enter Username: "); } while(!pass) { pass = prompt("Enter Password: "); } if((uname == corr_uname) && (pass == corr_pass)) { alert("Access Granted!!"); } else { alert("Access Denied!"); myFunction(); } } </script> <h1>Welcome!</h1> </body> </html> Cambié el nombre de su alert funcional a alert2 .
Por favor, acéptelo como respuesta si le funciona, ¡gracias!
JavaScript tenía funciones incorporadas mutables, por lo que su función de alert sobrescribe la alerta nativa y cada llamada de alerta se vuelve recursiva en un ciclo interminable.
Además de cambiar el nombre de la función, no hay necesidad de usar un bucle while ya que el indicador detiene la ejecución. Puede usar uname && para invalidar el nombre de usuario si el usuario cancela la solicitud de nombre de usuario.
Tampoco hay necesidad de usar <body onload="??"> si simplemente coloca el script dentro de <head>...</head>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Alert test</title> <script> const corr_uname = "admin", corr_pass = "admin"; function authenticate() { const uname = prompt("Enter Username: "); const pass = uname && prompt("Enter Password: "); const isCredentialsValid = uname == corr_uname && (pass == corr_pass); const accessType = isCredentialsValid ? 'Granted' : 'Denied'; alert(`Access ${accessType}!!`); } authenticate(); </script> </head> <body> <h1>Welcome!</h1> </body> </html>