Loading...

分享一段基于jQuery的表单验证的javascript

有jQuery,一切都好办了,因为用它可以方便的定位到html中的任何一个节点,下面一段代码是cosbeta用于表单验证的javascript脚本:

首先引入jQuery库

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”></script>

然后编写验证表单的函数

function valid(s){
var e=s.split(‘&’);var i=0;
while( i<e.length ){
var tmp=e[i].split(‘=’);
var el = “#”+tmp[0];
var fv =$(el).val();
var tp = tmp[1];
$(el).next().hide();//将表单域后面的出错提示隐藏掉
if( tp == “text” ){
if( fv == “” ) {
$(el).next().show(); //若表单域为空,则显示出错提示
return false; //返回false,以下相同
}
}
if( tp == “int” ){
if( isNaN( fv ) ) {
$(el).next().show();
return false;
}
}
if( tp == “email” ){
var res = new RegExp(“^([A-Za-z0-9_|-]+[.]*[A-Za-z0-9_|-]+)+@[A-Za-z0-9|-]+([.][A-Za-z0-9|-]+)*[.][A-Za-z0-9]+$”,”ig”);
if (!res.test(fv)){
$(el).next().show();
return false;
}
}
i++;
}
}

使用方法距离:

<input size=”20″ type=”text” name=”email” id=”email”  />
<span class=”errormsg”>E-mail is not valid</span>
<input type=”password” name=”password” id=”password”    />
<span class=”errormsg”>password is required</span>
<input type=”submit” value=”Login” onClick=”return valid(’email=email&password=text’)”/>

valid的参数说明,若表单域中的input或者select等等需要是email格式,则参数为xxx=email,数字格式为xxx=int,其他非空文本格式则为xxx=text,验证多个表单域用&将其连接起来,如name=text&mail=email&age=int

案例可以参见生活点滴虚拟主机的注册表单案例,当然,这个案例更加智能,但是不如本文的代码效率高和灵活,所以才有了这篇日志。

标签:,
发表于 2009-03-18 14:32:13 目录:HTML客户端, 网站技术 [RSS 2.0] 你可以发表评论, 或者从您的网站 trackback
  • 相关阅读
  • homezz 美国专业主机商
    已经有4位大师动手指导 拒绝低俗
    • 1楼 大脚 在2009.03.18 18:58发表评论如下: 回复

      老大,还是很深奥,应用具体的地方如何用呢??我是菜鸟…不好懂啊….

      • 1楼附属品 江东 在2009.03.18 19:05发表评论如下: 回复

        就是那种提示:用户名不能为空,密码不能为空的那种

      • 2楼 Fengshen.Name 在2009.03.18 19:56发表评论如下: 回复

        jQuery是啥啊!

        • 3楼 Alan 在2009.03.18 23:32发表评论如下: 回复

          前排占位,收藏鸟

          评论分页: 1
          (Required)
          (Required, not published)
          如果留言未显示无需重复留言,我将为你恢复!