简单,智能,令人愉悦的表单验证~~~

官方文档:http://www.niceue.com/validator/

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="js/validator/jquery.validator.css"/>
<script src="js/jquery.min.js"></script>
<script src="js/validator/jquery.validator.min.js"></script>
<script src="js/validator/local/zh-CN.js"></script>
<script>
$(function(){
$('#userform').validator({
rules: {
telnumber: [/^\d{11}$/],
adminame:function(){
return $("#username").val()=="admin"||"请输入正确的用户名"
}
},
fields: {
username:{
rule:"required;adminame",
msg: {
required: "请填写用户名!"
}
},
usertel:{
rule:"required;telnumber",
msg: {
required: "请填写手机号码!",
telnumber:"请输入11位数字的手机号码"
},
tip:"密码由6-20位数字、字母或下划线组成!",
ok: "输入正确"
}
},
valid: function(form){
//表单验证通过,提交表单到服务器
alert("验证通过");
$.ajax({
url: "result.php",
data: $(form).serialize(),
success: function(d){
//do something
}
});
}
})
})
</script>
</head>
<body>
<form name="userform" id="userform">
用户名:<input type="text" name="username" id="username" placeholder="请输入用户名"/> <span class="msg-box" for="loginName"></span><br><br>
手机号:<input type="tel" name="usertel" placeholder="请输入手机号"/><br><br>
<button type="submit">提交</button>
</form>
</body>
</html>

客户端的验证插件validator的更多相关文章

  1. 表单验证插件-validator.js 使用教程

    做网站的时候,常常会涉及到各种表单验证.选择一款好用的表单验证插件,会降低表单验证开发的难度.在开发中,我目前使用的表单验证插件是:validator.js. validator.js 是一款轻量的表 ...

  2. jquery插件-表单验证插件-validator对象

    三 Validator对象 1.介绍:Validate方法返回的对象称作Validator对象 2.使用 Validator对象常用方法 Validator.form() 返回:Boolean 验证: ...

  3. //解决validator验证插件多个name相同只验证第一的问题

    //解决validator验证插件多个name相同只验证第一的问题 var validatorName = function () { if ($.validator) { $.validator.p ...

  4. jQuery学习之:Validation表单验证插件

    http://polaris.blog.51cto.com/1146394/258781/ 最近由于公司决定使用AJAX + Struts2来重构项目,让我仔细研究一下这两个,然后集中给同事讲讲,让每 ...

  5. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

  6. 网站开发常用jQuery插件总结(四)验证插件validation

    在网站开发过程中,有时我们需要验证用户输入的信息是否符合我们的要求,所以我们会对用户提交的数据进行验证.验证分两次进行,一次是在客户端,一次是在服务端.客户端的验证可以提升用户的体验. jquery验 ...

  7. (转)强大的JQuery表单验证插件 FormValidator使用介绍

    jQuery formValidator表单验证插件是客户端表单验证插件.在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者(J ...

  8. 在SpringBoot中使用FluentValidator验证插件

    前言 在我们编写项目的时候,在controller中往往离不开对一些数据的校验.这里并不是说对于这些数据业务上面的校验,而是对这些数据进行空校验或者是长度校验等. 有些时候校验可以省略,根据业务的需要 ...

  9. 强大的JQuery表单验证插件 FormValidator使用介绍

    jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人资料,录入一些常规数据等等.在这之前,页面开发者( ...

随机推荐

  1. MVC5 网站开发之九 网站设置

    网站配置一般用来保存网站的一些设置,写在配置文件中比写在数据库中要合适一下,因为配置文件本身带有缓存,随网站启动读入缓存中,速度更快,而保存在数据库中要单独为一条记录创建一个表,结构不够清晰,而且读写 ...

  2. 【置顶】CoreCLR系列随笔

    CoreCLR配置系列 在Windows上编译和调试CoreCLR GC探索系列 C++随笔:.NET CoreCLR之GC探索(1) C++随笔:.NET CoreCLR之GC探索(2) C++随笔 ...

  3. C# 用SoapUI调试WCF服务接口(WCF中包含用户名密码的验证)

    问题描述: 一般调试wcf程序可以直接建一个单元测试,直接调接口. 但是,这次,我还要测试在接口内的代码中看接收到的用户名密码是否正确,所以,单一的直接调用接口方法行不通, 然后就想办法通过soapU ...

  4. python 3.5 成功安装 scrapy 的步骤

    http://www.cnblogs.com/hhh5460/p/5814275.html

  5. JVM类加载

    JVM的类加载机制就是:JVM把描述类的class文件加载到内存,并对数据进行校验.转换解析和初始化,最终形成可以被JVM直接使用的Java类型 ClassLoader JVM中的ClassLoade ...

  6. 微信公众号开发(一)--验证服务器地址的Java实现

    现在主流上都用php写微信公众号后台,其实作为后端语言之一的java也可以实现. 这篇文章将对验证服务器地址这一步做出实现. 参考资料:1.慕课网-<初识java微信公众号开发>,2.微信 ...

  7. html中返回上一页的各种写法【转】

    超链接返回上一页代码: <a href="#" onClick="javascript :history.back(-1);">返回上一页</ ...

  8. [Hadoop in Action] 第5章 高阶MapReduce

    链接多个MapReduce作业 执行多个数据集的联结 生成Bloom filter   1.链接MapReduce作业   [顺序链接MapReduce作业]   mapreduce-1 | mapr ...

  9. 关于sqlmap的使用

    好记性不如烂笔头,记录一下. 带cookie的注入 python sqlmap.py -u "http://www.xxx.com?id=1" --cookie="coo ...

  10. Xamarin. Android实现下拉刷新功能

    PS:发现文章被其他网站或者博客抓取后发表为原创了,给图片加了个水印 下拉刷新功能在安卓和iOS中非常常见,一般实现这样的功能都是直接使用第三方的库,网上能找到很多这样的开源库.然而在Xamarin. ...