相关Jquery Validator采用
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.aspx.cs" Inherits="WebApplication1.index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<!--css,能够修改的。依据从www.jquery.com上面下载的插件修改的-->
<link href="css/screen.css" rel="stylesheet" type="text/css" />
<script src="lib/jquery.js" type="text/javascript"></script>
<script src="dist/jquery.validate.min.js" type="text/javascript"></script>
<!--信息汉化-->
<script src="src/localization/messages_zh.js" type="text/javascript"></script>
<style type="text/css">
.style1
{
width: 50%; border:1px solid #cccccc; border-collapse:collapse; font-size:12px;
}
.style1 td{ border:1px solid #cccccc; height:25px; }
input{ border:1px solid #cccccc; height:20px;}
#Select1
{
height: 20px;
width: 150px;
}
.success {
background:url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
</style>
<script type="text/javascript">
//自己定义方法
//addMethod("验证方法名")
$.validator.addMethod("checkHometown", function (value, element) {
return value == "请选择籍贯" ?
false : true;
}, "请选择籍贯");
//验证手机号码的自己定义方法
$.validator.addMethod("checkMobile", function (value, element) {
var myreg = /^(((13[0-9]{1})|159|153)+\d{8})$/; //手机号码正则
if (myreg.test(value)) {
return true;
}
else {
return false;
}
}, "手机格式不正确");
$(function () {
$("#signupForm1").validate({
rules: {
uname: { required: true, minlength: 3, maxlength: 10,
remote: "check_user_exists.ashx" //调用ajax使用一般处理程序,做用户验证,參数自己帮你传了,通常是參数名(控件名)=值
},
password: { required: true, minlength: 3, maxlength: 20 },
confirmPassword: { required: true, equalTo: "#password" },
homeTown: { checkHometown: true },
email: { required: true },
mobile: { required: true, checkMobile: true }//checkMobile是上面自定义的方法
},
success: function (label) {
label.text(" ").addClass("success"); //验证成功
},
messages: {
uname: { remote: "username不可用" },
password: { required: "请输入password", minlength: "password长度不少于3个", maxlength: "password长度不多于20" },
confirmPassword: { equalTo: "password不匹配" }
},
submitHandler: function () {
alert("加入"); //提交到server
}
});
});
</script>
</head>
<body>
<form id="signupForm1" runat="server" >
<h1>验证框架Demo</h1>
<div>
<table class="style1">
<tr>
<td>
username</td>
<td>
<input id="uname" name="uname" type="text" /></td>
</tr>
<tr>
<td>
password</td>
<td>
<input id="password" name="password" type="password" /></td>
</tr>
<tr>
<td>
确认password</td>
<td>
<input id="confirmPassword" name="confirmPassword" type="password" /></td>
</tr>
<tr>
<td>
籍贯</td>
<td>
<select id="homeTown" name="homeTown">
<option value="请选择籍贯">请选择籍贯</option>
<option value="湖南">湖南</option>
<option value="湖北">湖北</option>
<option value="江西">江西</option>
</select></td>
</tr>
<tr>
<td>
Email</td>
<td>
<input id="email" type="email" name="email" /></td>
</tr>
<tr>
<td>
手机号码</td>
<td>
<input id="mobile" name="mobile" type="text"/></td>
</tr>
<tr>
<td>
</td>
<td>
<input type="submit" value="Submit"/>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
源我不知道如何上传代码,有需要的可以联系我:31385073@qq.com
版权声明:本文博主原创文章。博客,未经同意不得转载。
相关Jquery Validator采用的更多相关文章
- jQuery validator plugin 之 custom methods 案例1:multi email
1.add method jQuery.validator.addMethod( "multiemail", function (value, element) { var ema ...
- jQuery validator自定义
项目中接触到validator,记录下 jQuery.validator.addMethod("isStrongPwd", function(value, element){ va ...
- jQuery.validator 详解二
前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...
- jQuery.validator 验证规则详解
前言:jQuery.validator是一款非常不错的表单验证插件,验证方式非常简单方便,它还对HTML5做了兼容处理,了解了验证规则,就基本掌握了它的使用,下面就让我一一道来 jQuery.vali ...
- jQuery.validator 详解
jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...
- jQuery 表单验证 jquery.validator.js
前端开发中经常会碰到表单的制作,其中必备的功能就是提交前的一些简单的验证,非空啊.手机号码啊.E-mail等等等等,这里是一个 jQuery 的表单验证插件,蛮好用的,收录一下. 下面是验证的效果图: ...
- 客户端验证的极品--jQuery.validator
最近在做一个用户注册登录的页面,资料查寻过程中发现了一个非常不错的客户端验证的极品-jQuery.validate.它是著名的JavaScript包jQuery的一个插件,其实它还有其它的一些插件应该 ...
- (转)jquery.validator规则
登录|注册 收藏成功 确定 收藏失败,请重新收藏 确定 标题 标题不能为空 网址 标签 摘要 公开 取消收藏 分享资讯 传PPT/文档 提问题 写博客 传资源 ...
- JQuery validator扩展
//validator 扩展 jQuery.validator.addMethod("mail", function(value, element, messages) { ret ...
随机推荐
- 8月30号周五香港接单ING~~化妆品只加10元!!!!!!
8月30号周五香港接单ING~~化妆品只加10元!!!!!! 8月30号周五香港接单ING~~化妆品只加10元!!!!!!
- java 获取当期时间之前几小时的时间
Calendar expireDate = Calendar.getInstance(); expireDate.set(Calendar.HOUR_OF_DAY, expireDate.get(Ca ...
- 《Qt编程的艺术》——9.1 QtSql模块的结构
QtSql是一个独立的库,如果需要的话,它可以加载附加的插件.不同于QtCore和QtGui,它的内容默认情况下并没有整合进生成的project中.要使用这个库,我们要编辑 .pro文件,添加下列条目 ...
- 跟着ZHONGHuan学习设计模式--桥接模式
转载请注明出处! ! !http://blog.csdn.net/zhonghuan1992 全部配套代码均在github上:https://github.com/ZHONGHuanGit/Desig ...
- 单服务器防护linux iptables脚本
#!/bin/bashiptables -Fiptables -P INPUT DROPiptables -P OUTPUT ACCEPTiptables -P FORWARD DROP/sbin/i ...
- java參数传递方式问题
java的參数传递方式到底是值传递还是引用传递,这一直是一个争论不休的问题,一直以来没有形成统一意见. 在这里,我也仅仅是说一说个人见解,不保证是对的,全当是抛砖引玉. 首先我的观点是java採用的是 ...
- c#代码规范和质量检查工具这点事
c#代码规范和质量检查工具这点事 代码风格检查:StyleCop 代码缺陷检查:FxCop 代码质量: 代码度量值/Code Metrics StyleCop 介绍 The StyleCop tool ...
- LAMP配置参考地址
http://www.linuxidc.com/Linux/2014-07/104563.htm
- 查看mysql当前表使用的存储引擎(转)
说明:当我们创建表 “test”表时 CREATE TABLE test ( id INT(11) default NULL auto_increment, s char(60) default NU ...
- 重写equals()与hashCode()方法
出自:http://blog.csdn.net/renfufei/article/details/16339351 Java语言是完全面向对象的,在java中,所有的对象都是继承于Object类.Oj ...