如何在我的javascript表单验证中添加正则表达式测试?

时间:2012-07-20 13:55:59

标签: javascript forms validation

我已经使用javascript创建了一个简单的表单验证,并希望在输入中添加一些模式测试,以确保显然提交了正确的信息,但我对此非常新,我希望看看有人可以帮我解决问题添加模式测试。

到目前为止我的验证码是:

function validate(form) {
var fail = false;
var name = document.getElementById("full_name");

if (name.value.length == 0) {
  document.getElementById("okName").className = "fail";
  fail = true;
}else{
  document.getElementById("okName").className = "success";
}



var email = document.getElementById("email");
var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;

if (email.value.length == 0) {
  document.getElementById("okEmail").className = "fail";
    fail = true;
}else{
  document.getElementById("okEmail").className = "success";
}

}

我认为我必须将条件添加到电子邮件验证的“if”语句中,但是不知道从哪里开始?我知道如何使用jQuery做到这一点:

if( value.length<1 /*|| value==field_values[$(this).attr('id')]*/ || ( $(this).attr('id')=='email' && !emailPattern.test(value) )  )

但我不知道如何在原始javaScript中做同样的事情,因为我不知道如何在普通的javascript中定位电子邮件的输入!如果有人能帮助我,我真的很感激!

2 个答案:

答案 0 :(得分:2)

这看起来像是:

var email = document.getElementById("email");
var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;

if (!emailPattern.test(email.value)) {
  document.getElementById("okEmail").className = "fail";
    fail = true;
}else{
  document.getElementById("okEmail").className = "success";
}

也无需检查字符串的长度。无需为了这么简单的设置而对您的网页进行jQuerize。 : - )

一些建议:

  • 从不依赖客户端验证
  • 验证控件是否确实存在(即if(email){...})
  • 修剪字符串或提供名称模式(您的表单在表单字段中输入单个空格字符进行验证)
  • 实际上您的电子邮件模式也不正确(点是[])中的“任何字符”

答案 1 :(得分:0)

if (email.value.length === 0 || !emailPattern.test(email.value) ) {
  document.getElementById("okEmail").className = "fail";
  fail = true;
} else {
  document.getElementById("okEmail").className = "success";
}