jquery validation插件表单验证的一个例子


Posted in Javascript onMarch 03, 2010

messages_cn.js <!--验证国际化,中文--> (不引用messages_cn.js是英文的提示,用了是中文)

required: "This field is required.", 
remote: "Please fix this field.", 
email: "Please enter a valid email address.", 
url: "Please enter a valid URL.", 
date: "Please enter a valid date.", 
dateISO: "Please enter a valid date (ISO).", 
dateDE: "Bitte geben Sie ein gültiges Datum ein.", 
number: "Please enter a valid number.", 
numberDE: "Bitte geben Sie eine Nummer ein.", 
digits: "Please enter only digits", 
creditcard: "Please enter a valid credit card number.", 
equalTo: "Please enter the same value again.", 
accept: "Please enter a value with a valid extension 
maxlength: Please enter no more than {0} characters 
minlength: Please enter at least {0} characters 
rangelength: Please enter a value between {0} and {1} characters long. 
range: Please enter a value between {0} and {1}. 
max: Please enter a value less than or equal to {0}. 
min: Please enter a value greater than or equal to {0}. 
<script type="text/javascript"> 
$(function() { 
$("#btnOk").click(function() { 
$("#form1").validate({ rules: { 
username: { required: true, minlength: 2 }, 
email: { required: true, email: true }, 
url: { required: true, url: true }, 
comment: "required" 
} 
}); 
}); 
}); 
</script> 
<body> 
<form id="form1" runat="server" action="" method="get"> 
<fieldset> 
<legend>一个简单的验证带验证评论的例子</legend> 
<p> 
<label for="cusername">姓名</label><em>*</em> 
<input type="text" id="cusername" name="username" size="25"/> 
</p> 
<p> 
<label for="cemail">邮件</label><em>*</em> 
<input type="text" id="cemail" name="email" size="25"/> 
</p> 
<p> 
<label for="curl">网址</label><em>*</em> 
<input type="text" id="curl" name="url" size="25"/> 
</p> 
<p> 
<label for="ccomment">你的评论</label><em>*</em> 
<textarea id="ccomment" name="comment"cols="22"></textarea> 
</p> 
<p> 
<%--<input type="submit" id="send" value="提交"/>--%> 
<asp:Button ID="btnOk" runat="server" Text="提交" onclick="btnOk_Click"/> 
</p> 
</fieldset> 
</form> 
</body>
Javascript 相关文章推荐
用prototype实现的简单小巧的多级联动菜单
Mar 24 Javascript
Extjs4实现两个GridPanel之间数据拖拽功能具体方法
Nov 21 Javascript
Jquery each方法跳出循环,并获取返回值(实例讲解)
Dec 12 Javascript
JavaScript数据类型检测代码分享
Jan 26 Javascript
javascript实现简单的页面右下角提示信息框
Jul 31 Javascript
基于jQuery实现动态数字展示效果
Aug 12 Javascript
让图片跳跃起来  javascript图片轮播特效
Feb 16 Javascript
浅谈webpack 自动刷新与解析
Apr 09 Javascript
vue实现的组件兄弟间通信功能示例
Dec 04 Javascript
浅谈js中的bind
Mar 18 Javascript
vue+iview/elementUi实现城市多选
Mar 28 Javascript
vue循环中点击选中再点击取消(单选)的实现
Sep 10 Javascript
Jquery 实现Tab效果 思路是js思路
Mar 02 #Javascript
JavaScript页面刷新与弹出窗口问题的解决方法
Mar 02 #Javascript
在一个浏览器里呈现所有浏览器测试结果的前端测试工具的思路
Mar 02 #Javascript
jQuery对象和DOM对象的相互转化实现代码
Mar 02 #Javascript
Javascript 自定义类型方法小结
Mar 02 #Javascript
Javascript Cookie读写删除操作的函数
Mar 02 #Javascript
28个JS验证函数收集
Mar 02 #Javascript
You might like
ThinkPHP添加更新标签的方法
2014/12/05 PHP
Yii中使用PHPExcel导出Excel的方法
2014/12/26 PHP
javascript+xml技术实现分页浏览
2008/07/27 Javascript
jquery.validate分组验证代码
2011/03/17 Javascript
javaScript(JS)替换节点实现思路介绍
2013/04/17 Javascript
jquery实现的可隐藏重现的靠边悬浮层实例代码
2013/05/27 Javascript
jquery select多选框的左右移动 具体实现代码
2013/07/03 Javascript
innerHTML中标签可以换行的方法汇总
2015/08/14 Javascript
jQuery实现简单的文件上传进度条效果
2020/03/26 Javascript
AngularJS 避繁就简的路由
2016/07/01 Javascript
JavaScript对象封装的简单实现方法(3种方法)
2017/01/03 Javascript
vue 1.x 交互实现仿百度下拉列表示例
2017/10/21 Javascript
js动态设置select下拉菜单的默认选中项实例
2018/08/21 Javascript
GOJS+VUE实现流程图效果
2018/12/01 Javascript
vue动态注册组件实例代码详解
2019/05/30 Javascript
8个有意思的JavaScript面试题
2019/07/30 Javascript
vue实现移动端省市区选择
2019/09/27 Javascript
VUE中鼠标滚轮使div左右滚动的方法详解
2020/12/14 Vue.js
python求列表交集的方法汇总
2014/11/10 Python
Python爬取读者并制作成PDF
2015/03/10 Python
python字符串过滤性能比较5种方法
2017/06/22 Python
python爬虫获取京东手机图片的图文教程
2017/12/29 Python
python 猴子补丁(monkey patch)
2019/06/26 Python
pandas分区间,算频率的实例
2019/07/04 Python
浅析pandas 数据结构中的DataFrame
2019/10/12 Python
django框架中间件原理与用法详解
2019/12/10 Python
Pycharm安装并配置jupyter notebook的实现
2020/05/18 Python
python 将列表里的字典元素合并为一个字典实例
2020/09/01 Python
python与c语言的语法有哪些不一样的
2020/09/13 Python
欧舒丹美国官网:L’Occitane美国
2018/02/23 全球购物
New Balance加拿大官方网站:运动鞋和健身服装
2018/11/19 全球购物
有影响力的人、名人和艺术家的官方商品:Represent
2019/11/26 全球购物
2014年银行工作总结范文
2014/11/12 职场文书
2014年政协委员工作总结
2014/12/01 职场文书
创业计划书之水果店
2019/07/18 职场文书
Tomcat配置访问日志和线程数
2022/05/06 Servers