如何使用javascript进行HTML登录页面验证？

更新时间：2023-12-03 15:47:46

您可以使用span标记作为占位符以编程方式显示消息。请参阅示例：

 <  ！DOCTYPE     html  >  
<   html  >  
<   head  >  
<  脚本 >  
 function  validateForm（）{
 var  x =  document  .forms [  form1] [  fname]。value; 
 if （x ==  null  || x ==  ）{
 //  使用消息填写占位符 
 document  .getElementById（  errorMsg）。innerHTML =   *名称必须填写; 
 return   false ; 
} 
} 
<   /   script  >  
<   / head  >  
<  正文 >  
<   form     name   =  form1    onsubmit   =  return validateForm（） &gt ;  
名称：<  输入    type   =  text    名称  =  fname >  
<   br  >  
<！ -  -    占位符   - >   
<   span     id   =  errorMsg    style   =  color：red >  <   / span  >  
<   br  >  
<  输入    type   = 提交    value   = 提交 >  
<   / form  >  
<   / body  >  
<   / html  > 跨度>

HI All I am newbie to coding.
I have designed login page using html. I was trying to validate the email and password using JavaScript. Actually, my problem is when we enter email and password if these credentials didn't match it should show error message below email or password like "invalid email or password you entered". Note: I don't want pop up message.
I want client side code for that.

What I have tried:

I have tried using JavaScript code but i am getting only email password pattern validations.

You can use a span tag as placeholder to display a message programmatically. See example:

<!DOCTYPE html>
<html>
<head>
<script>
function validateForm() {
    var x = document.forms["form1"]["fname"].value;
    if (x == null || x == "") {
        // fill out the placeholder with a message
        document.getElementById("errorMsg").innerHTML = "*Name must be filled out";
        return false;
    }
}
</script>
</head>
<body>
<form name="form1" onsubmit="return validateForm()">
  Name: <input type="text" name="fname">
  <br>
  <!-- placeholder -->
  <span id="errorMsg" style="color:red"></span>
  <br>
  <input type="submit" value="Submit">
</form>
</body>
</html>

上一篇 : ：J2EE中的容器到底是什么?它有什么帮助?下一篇 : 如何自动选择JTable中最后插入的行?

如何使用javascript进行HTML登录页面验证？

相关阅读

推荐文章