Javascript 需要形成成功的消息_Javascript_Html_Forms_Validation

Javascript 需要形成成功的消息

javascript html forms validation

Javascript 需要形成成功的消息,javascript,html,forms,validation,Javascript,Html,Forms,Validation,我有一个表单，如果用户名和密码为空，或者不够长，我需要能够显示错误消息。我已经弄明白了这一点，它正在发挥作用。我现在的问题有两个。1如何在1警报中显示多个错误？数组的使用？？如果所有信息都输入正确，如何生成成功的警报。这是我的javascript和html <script> function formIsValid(){ var validation = true; validation &= checkUsername(); validation &= checkP

我有一个表单，如果用户名和密码为空，或者不够长，我需要能够显示错误消息。我已经弄明白了这一点，它正在发挥作用。我现在的问题有两个。1如何在1警报中显示多个错误？数组的使用？？如果所有信息都输入正确，如何生成成功的警报。这是我的javascript和html

<script>
function formIsValid(){
var validation = true;
validation &= checkUsername();
validation &= checkPassword();
return validation;
}   


function checkUsername(){
var name= document.forms["RegistrationForm"]["user"].value; 
var nameLength =name.length;
if(name == ""){
alert ("Please Enter a Username");
return false;
}
else if (nameLength <8){
alert ("The Username must be 8 characters");
return false;
}
}

function checkPassword(){   
var password=document.forms["RegistrationForm"]["pass"].value;
var passwordLength =password.length;
if(password ==""){
alert ("Please Enter a Password");
return false;
}
else if (passwordLength <8){
alert ("The Password must be 8 characters");
return false;
}
}



</script>

Html代码

<form name="RegistrationForm"  onsubmit="return formIsValid()" action="">
<h2>Registration</h2>
Username:<input type="text" name="user" size="20"/> (At least 8 characters)<br/>
<br/>
Password:<input type="text" name="pass" size="20"/> (At least 8 Characters)<br/>
<br/>

<input type="submit" value="Submit">    
<input type="reset" name="reset" value="Clear"/>
<p>
</form>

也许有点像这样：

function checkPassword(errors){   
    ...
    if (password == "") {
        errors.push("Please Enter a Password");
    } else if (passwordLength <8){
        errors.push("The Password must be 8 characters");
    }

    return errors;
}

function formIsValid(){
    var errors = [];
    errors = checkUsername(errors);
    errors = checkPassword(errors);

    if (errors.length == 0) alert('win');
    else alert(errors.join('\r\n'));
}

请尝试以下代码，它将按照您想要的方式工作：

<html>
<head>
<script>
var userFlag =true;
var passFlag = true;
var msg = "";
function formIsValid(){
  checkUsername();
  checkPassword();
  if(passFlag && userFlag ){

   return true;
  }
  else{
    alert (msg);
    msg="";
    return false;
  }
}   


function checkUsername(){
  var name= document.forms["RegistrationForm"]["user"].value; 
  var nameLength =name.length;
  if(name == ""){
    msg +="Please Enter a Username";
    userFlag = false;
  }
  else if (nameLength <8){
    msg +="The Username must be 8 characters";
    userFlag = false;  
  }
}

function checkPassword(){   
  var password=document.forms["RegistrationForm"]["pass"].value;
  var passwordLength =password.length;
  if(password ==""){ 
    msg += " and Please Enter a Password";
    passFlag = false;
  }
  else if (passwordLength <8){
    msg += "and The Password must be 8 characters";
    passFlag = false;
  }
}
</script> 
</head>

<body>
    <form name="RegistrationForm"  onsubmit="return formIsValid()" action="">
      <h2>Registration</h2>
      Username:<input type="text" name="user" size="20"/> (At least 8 characters)<br/>
      <br/>
      Password:<input type="text" name="pass" size="20"/> (At least 8 Characters)<br/>
      <br/>
      <input type="submit" value="Submit">    
      <input type="reset" name="reset" value="Clear"/>
    </form> 
</body>
</html>

对于第一个问题，您应该将所有验证打包到一个函数中。在该函数中，抛出验证函数，并将它们存储在数组中，并将布尔值设置为false，而不是为每个错误显示单个警报。在验证结束时，如果布尔值为false，则抛出警报，然后添加存储在数组中的字符串错误。对于第二个问题，为什么不简单地显示一个警报呢？您可以不使用警报，而是将错误消息放在一个数组中，然后如果您的数组不是空的，就会有错误，您可以通过循环错误来查看它们。请参阅下面的代码我在这里添加了一些验证。这适用于多个警报，但是，如果最终成功，则没有消息。如果它创建了一条错误消息，那么在您修复它之后，您将获得成功。