<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<title></title>
</head>
<style type="text/css">
.err{
color:#ff0000;
font-weight: bold;
display: none;
}
</style>
<body>
<form action="" method="post">
<p>
<input type="text" name="zhanghao" id="" placeholder="请输入账号" class="atch"/>
<span class="err">账号不低于5位</span>
</p>
<p>
<input type="password" name="mima" id="" placeholder="请输入密码" class="atch"/>
<span class="err">密码有误</span>
</p>
<p>
<input type="password" name="twomima" id="" placeholder="请再次输入密码" class="atch"/>
<span class="err">密码不一致</span>
</p>
<p>
<input type="text" name="youxiang" id="" placeholder="请输入邮箱" class="atch"/>
<span class="err">邮箱格式不正确</span>
</p>
<p>
<input type="text" name="haoma" id="" placeholder="请输入手机号码" maxlength="11" class="atch"/>
<span class="err">手机号码不正确</span>
</p>
<input type="submit" value="提交"/>
</form>
<script type="text/javascript">
$(function(){
$("input[name=zhanghao]").blur(function(){
val=this.value;
if(val.length<5){
$(this).data({"s":0});
$(this).next().show();
}else{
$(this).data({"s":1});
$(this).next().hide();
}
});
$("input[name=mima]").blur(function(){
val=this.value;
if(val.length<8){
$(this).data({"s":0});
$(this).next().show();
}else{
$(this).data({"s":1});
$(this).next().hide();
}
});
$("input[name=twomima]").blur(function(){
var mima=$(this).val();
if($(this).val()!=mima){
$(this).data({"s":0});
$(this).next().show();
}else{
$(this).data({"s":1});
$(this).next().hide();
}
});
$("input[name=youxiang]").blur(function(){
var email=$(this).val();
if(!email.match(/^\w+@\w+\.\w+$/i)){
$(this).data({"s":0});
$(this).next().show();
}else{
$(this).data({"s":1});
$(this).next().hide();
}
});
$("input[name=haoma]").blur(function(){
var iphone=$(this).val();
if(!iphone.match(/^139\d{8}$/)){
$(this).data({"s":0});
$(this).next().show();
}else{
$(this).data({"s":1});
$(this).next().hide();
}
});
});

$("form").submit(function(){
$(".atch").blur();
tot=0;
$(".atch").each(function(){
tot+=$(this).data("s");
})
if(tot!=5){
return false;
}else{

}
})
</script>
</body>
</html>

非常实用的jquery版表单验证的更多相关文章

  1. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  2. jQuery formValidator表单验证插件

    什么是jQuery formValidator? jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人 ...

  3. [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  4. Jquery Validate 表单验证的多种方式

    ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...

  5. 【锋利的jQuery】表单验证插件踩坑

    和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在f ...

  6. jquery实现表单验证简单实例

    /* 描述:基于jquery的表单验证插件. */ (function ($) { $.fn.checkForm = function (options) { var root = this; //将 ...

  7. jQuery的表单验证

    jQuery的表单验证 直接上代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  8. Jquery 实现表单验证，所有验证通过方可提交

    1. [代码]Jquery 实现表单验证,所有验证通过方可提交 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  9. 用 jQuery 实现表单验证（摘抄）——选自《锋利的jQuery》（第2版）第5章的例题 5.1.5 表单验证

    5.1.5 表单验证 表单(form)作为 HTML 最重要的一个组成部分,几乎在每个网页上都有体现,例如用户提交信息.用户反馈信息和用户查询信息等,因此它是网站管理者与浏览者之间沟通的桥梁.在表单中 ...

随机推荐

  1. ImageMagick Remote Command Execute

    CVE ID: CVE-2016-3714 我挺纠结应该用中文写博客还是应该用英文写博客.英文吧作用挺明显的,可以锻炼自己的英语表达能力,但是可能会阻碍和一些英文不好的朋友交流. It's upset ...

  2. Caffe CNN特征可视化

    转载请注明出处,楼燚(yì)航的blog,http://www.cnblogs.com/louyihang-loves-baiyan/ 以下部分代码是根据caffe的python接口,从一次forwo ...

  3. C# 事件编程在游戏开发的应用

    2D碰撞检测:http://wenku.baidu.com/view/45544cfcfab069dc50220145.html 1.Action System.Action 等于快捷创建一个委托 2 ...

  4. 开启云时代，银狐H5游戏云通迅框架解决方案出炉！

    没有时间开发服务器? 不懂服务器开发? 还在为WEB SOCKET烦恼?还在为网络卡,负载承受能力小烦恼? 银狐H5游戏云通迅框架,集成通讯SDK和开放API,1天即可完成 它也是开放平台,提供游戏需 ...

  5. flex sdk中mx_internal function getTextField() 这种函数如何调用？

    在用flex 开发中,一些函数前打上了 mx_internal 外部调用不了,其实这样写就可以了 xxx.mx_internal::getTextField() 而 xxx.getTextField( ...

  6. TextView和EditText中的setFilters方法说明

    在TextView中有一个方法public void setFilters(InputFilter[] filters),API中有一句说明:Sets the list of input filter ...

  7. Mysql备份系列（1）--备份方案总结性梳理

    mysql数据库备份有多么重要已不需过多赘述了,废话不多说!以下总结了mysql数据库的几种备份方案: 一.binlog二进制日志通常作为备份的重要资源,所以再说备份方案之前先总结一下binlog日志 ...

  8. C语言：联合变量

    #include <stdio.h> union hold{ int digit; double big; char letter; }; int main(){ union hold a ...

  9. MVC控制器总结

    1.特性 [AuthorizeFilter]  用于权限过滤 [HttpGet] [HttpPost] 2.参数 获取方法 public ActionResult void Get(int id){} ...

  10. 通用权限管理系统多语言开发接口 - java，php 调用接口程序，多业务子系统集成

    1:公司里有多个业务系统,需要进行统一重构,有PHP的.有Java的.有.NET的,甚至还有delphi的. 2:公司里有多个数据库系统,有mysql的.有sqlserver的.还有oracel的,甚 ...