Aquí estoy tratando de ejecutar el siguiente código, pero arroja el error anterior en la página del sitio web de inicio de sesión de la consola, no puedo identificar el error.
He codificado esta página web de tal manera que debería mostrar un error como "ingrese el nombre de usuario" e "ingrese la contraseña" cada vez que los cuadros de entrada se dejan vacíos, pero en lugar de esto, muestra un error de tipo no detectado. Amablemente ayúdame a encontrar la solución.
mi enlace de código de github es: https://github.com/harish-123445/login-form-using-html-css-javascript
function vfun(){ var uname=document.forms["myform"]["uname"].value; var pword=document.forms["myform"]["pword"].value; if(uname==null || uname=="" ){ document.getElementById("errorBox").innerHTML = "enter the user name"; return false; } if(pword==null || pword==""){ document.getElementById("errorBox").innerHTML = "enter the password"; return false; } if (uname != '' && pword != '' ){ alert("Login successfully"); } } <!DOCTYPE html> <html > <head> <title>sign in form</title> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="js.js"></script> <body> <div class="box"> <img src="user.png" class="user"> <h1 >LOGIN HERE</h1> <form class="myform" onsubmit= "return vfun()"> <p>USERNAME </p> <input type="text" name="uname" placeholder="enter username" > <p>PASSWORD </p> <input type="password" name="pword" placeholder="enter password"> <div id="errorBox"></div> <input type="submit" name="" value="login"> <br><br> <a href="register.html" >Register for new user</a> </form> </div> </body> </head> </html>He editado tu código. Llamé a su nombre de usuario y contraseña usando getElementById y sus dos cuadros de error con diferentes nombres de identificación y ahora funciona bien.
function vfun(){ var uname=document.getElementById("name").value; var psword=document.getElementById("passw").value; if(uname==null || uname=="" ){ document.getElementById("errorBox2").innerHTML = "enter the user name"; return false; } if(psword==null || psword==""){ document.getElementById("errorBox").innerHTML = "enter the password"; return false; } if (uname != '' && pword != '' ){ alert("Login successfully"); } } <!DOCTYPE html> <html > <head> <title>sign in form</title> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="js.js"></script> <body> <div class="box"> <img src="user.png" class="user"> <h1 >LOGIN HERE</h1> <form class="myform" onsubmit= "return vfun()"> <p>USERNAME </p> <input type="text" name="uname" id="name" placeholder="enter username" > <div id="errorBox2"></div> <p>PASSWORD </p> <input type="password" name="pword" id="passw" placeholder="enter password"> <div id="errorBox"></div> <input type="submit" name="" value="login"> <br><br> <a href="register.html" >Register for new user</a> </form> </div> </body> </head> </html>