Javascript验证不起作用?

时间:2012-05-14 11:14:31

标签: javascript forms validation

它为什么不起作用有什么不对......

 <script language="JavaScript" type="text/javascript">


//function to check empty fields

function isEmpty(strfield1, strfield2) {
  //change "field1, field2 and field3" to your field names

  strfield1 = document.forms[0].name.value 
  strfield2 = document.forms[0].email.value

  //name field

  if (strfield1 == "" || strfield1 == null || !isNaN(strfield1) || strfield1.charAt(0) == ' ') {
    alert( "Name is a mandatory field.\nPlease amend and retry.")
    return false;
  }

  //EMAIL field 
  if (strfield2 == "" || strfield2 == null || !isNaN(strfield2) || strfield2.charAt(0) == ' ') {
    alert(" Email is a mandatory field.\nPlease amend and retry.")
    return false;
  }
  return true;
}


//function to check valid email address

function isValidEmail(strEmail){
  validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
  strEmail = document.forms[0].email.value;

 // search email text for regular exp matches

  if (strEmail.search(validRegExp) == -1)  {
    alert('A valid e-mail address is required.\nPlease amend and retry');
    return false;
  } 
  return true; 
}


//function that performs all functions, defined in the onsubmit event handler

function check(form)){
  if (isEmpty(form.field1)){
    if (isEmpty(form.field2)){
      if (isValidEmail(form.email)){
        return true;
      }
    }
  }
}
return false;
}

</script>

它没有做任何事情我不明白发生了什么,并且我也把它放在了表格中

<form onsubmit="return check(this);" action="sendquery.php" name="contquery">

2 个答案:

答案 0 :(得分:3)

乍一看:@FishBasketGordo所示的括号太多所以我不会重复

第二眼 - 您通过该字段并且不测试字段值

第三眼:您没有将正确的名称传递给函数

第四眼 - isEmpty在空的时候返回false。它应该返回true

我修复了所有这些

DEMO HERE

完整页面以显示发生了什么。更新为在表单上进行不显眼的事件处理

<html>
<head>
<title>Validation</title>
<script type="text/javascript">

// trim for IE
if(typeof String.prototype.trim !== 'function') {
  String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g, '');
  }
}

//function to check empty fields

function isEmpty(objfld) {
  var val = objfld.value;
  if (val.trim() == "" || val == null) {
    alert(objfld.name+" is a mandatory field.\nPlease amend and retry.");
    objfld.focus();
    return true;
  }
  return false;
}

//function to check valid email address

function isValidEmail(objEmail){
  var validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
  var strEmail = objEmail.value;
  if (strEmail.match(validRegExp)) return true;
  alert('A valid e-mail address is required.\nPlease amend and retry');
  objEmail.focus();  
  return false;
}

//function that performs all functions, defined in the onsubmit event handler

function validate(form) {
  if (isEmpty(form.name)) return false;
  if (isEmpty(form.email)) return false;
  return isValidEmail(form.email);
}


window.onload=function() {
  document.getElementById("form1").onsubmit=function() {
    return validate(this);
  }
}

</head>
<body>
<form id="form1">
  Name:<input type="text" name="name" /><br/>
  Email:<input type="text" name="email" /><br/>
  <input type="submit" />
</form>    
</body>
</html>

答案 1 :(得分:2)

可能不起作用的主要原因是语法错误:

// Syntax error ----v
function check(form)){
    if (isEmpty(form.field1)){
        if (isEmpty(form.field2)){
            if (isValidEmail(form.email)){
                return true;
            }
        }
    }
}
// The return statement should be above the previous closing bracket 
// and the final closing bracket removed.
return false;
}

第一行还有一个额外的关闭,并且关闭括号太多了。如果您在FireBugChrome Developer Tools或类似工具中打开此功能,它会自动告诉您这一情况。