easyui validatebox验证


Posted in Javascript onApril 29, 2016
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <script src="easyui1.2.4/jquery-1.6.min.js" type="text/javascript"></script>
 <script src="easyui1.2.4/jquery.easyui.min.js" type="text/javascript"></script>
 <!--自定义验证-->
 <script src="easyui1.2.4/validator.js" type="text/javascript"></script>
 <link href="easyui1.2.4/themes/default/easyui.css" rel="stylesheet" type="text/css" />
 <script>
 
  $(function () {
    
   //设置text需要验证
   $('input[type=text]').validatebox();
  })
  
 </script>
</head>
<body>
 邮箱验证:<input type="text" validtype="email" required="true" missingMessage="不能为空" invalidMessage="邮箱格式不正确" /><br />
 网址验证:<input type="text" validtype="url" invalidMessage="url格式不正确[http://www.example.com]" /><br />
 长度验证:<input type="text" validtype="length[8,20]" invalidMessage="有效长度8-20" /><br />
 手机验证:<input type="text" validtype="mobile" /><br />
 邮编验证:<input type="text" validtype="zipcode" /><br />
 账号验证:<input type="text" validtype="account[8,20]" /><br />
 汉字验证:<input type="text" validtype="CHS" /><br />
 远程验证:<input type="text" validtype="remote['checkname.aspx','name']" invalidMessage="用户名已存在"/>
</body>
</html>
//自定义validator.js
//扩展easyui表单的验证
$.extend($.fn.validatebox.defaults.rules, {
 //验证汉字
 CHS: {
  validator: function (value) {
   return /^[\u0391-\uFFE5]+$/.test(value);
  },
  message: '只能输入汉字'
 },
 //移动手机号码验证
 mobile: {//value值为文本框中的值
  validator: function (value) {
   var reg = /^1[3|4|5|8|9]\d{9}$/;
   return reg.test(value);
  },
  message: '输入手机号码格式不准确.'
 },
 //国内邮编验证
 zipcode: {
  validator: function (value) {
   var reg = /^[1-9]\d{5}$/;
   return reg.test(value);
  },
  message: '邮编必须是非0开始的6位数字.'
 },
 //用户账号验证(只能包括 _ 数字 字母) 
 account: {//param的值为[]中值
  validator: function (value, param) {
   if (value.length < param[0] || value.length > param[1]) {
    $.fn.validatebox.defaults.rules.account.message = '用户名长度必须在' + param[0] + '至' + param[1] + '范围';
    return false;
   } else {
    if (!/^[\w]+$/.test(value)) {
     $.fn.validatebox.defaults.rules.account.message = '用户名只能数字、字母、下划线组成.';
     return false;
    } else {
     return true;
    }
   }
  }, message: ''
 }
})
Javascript 相关文章推荐
Extjs学习笔记之七 布局
Jan 08 Javascript
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
Oct 10 Javascript
jQuery中阻止冒泡事件的方法介绍
Apr 12 Javascript
判断window.onload是否多次使用的方法
Sep 21 Javascript
分享jQuery插件的学习笔记
Jan 14 Javascript
JavaScript几种数组去掉重复值的方法推荐
Apr 12 Javascript
Jquery修改image的src属性,图片不加载问题的解决方法
May 17 Javascript
Angular 常用指令实例总结整理
Dec 13 Javascript
jqueryUI tab标签页代码分享
Oct 09 jQuery
Angular4实现鼠标悬停3d倾斜效果
Oct 25 Javascript
自定义Vue组件打包、发布到npm及使用教程
May 22 Javascript
js实现双人五子棋小游戏
May 28 Javascript
浅析Bootstrap缩略图组件与警示框组件
Apr 29 #Javascript
javascript中利用柯里化函数实现bind方法
Apr 29 #Javascript
Bootstrap模态对话框的简单使用
Apr 29 #Javascript
jquery UI Datepicker时间控件的使用及问题解决
Apr 28 #Javascript
jquery弹出遮掩层效果【附实例代码】
Apr 28 #Javascript
onclick和onblur冲突问题的快速解决方法
Apr 28 #Javascript
如何使用jquery修改css中带有!important的样式属性
Apr 28 #Javascript
You might like
德生S2000南麂列岛台湾FM收听记录
2021/03/02 无线电
基于PHP静态类的原罪详解
2013/05/06 PHP
thinkphp多表查询两表有重复相同字段的完美解决方法
2016/09/22 PHP
简单谈谈PHP面向对象之标识对象
2017/06/27 PHP
PHP简单实现欧拉函数Euler功能示例
2017/11/06 PHP
Yii2框架视图(View)操作及Layout的使用方法分析
2019/05/27 PHP
PHP上传图片到数据库并显示的实例代码
2019/12/20 PHP
基于PHP实现用户登录注册功能的详细教程
2020/08/04 PHP
基于JQuery框架的AJAX实例代码
2009/11/03 Javascript
Jquery实现无刷新DropDownList联动实现代码
2010/03/08 Javascript
javascript数组操作总结和属性、方法介绍
2014/04/05 Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
2014/09/04 Javascript
使用JQuery实现的分页插件分享
2015/11/05 Javascript
详解Vue.js动态绑定class
2016/12/20 Javascript
JS实现的系统调色板完整实例
2016/12/21 Javascript
JavaScript中捕获与冒泡详解及实例
2017/02/03 Javascript
浅谈Node模块系统及其模式
2017/11/17 Javascript
基于JavaScript 实现拖放功能
2019/09/12 Javascript
构建Vue大型应用的10个最佳实践(小结)
2019/11/07 Javascript
Python使用PIL库实现验证码图片的方法
2016/03/11 Python
Phantomjs抓取渲染JS后的网页(Python代码)
2016/05/13 Python
Python中循环后使用list.append()数据被覆盖问题的解决
2018/07/01 Python
Python3爬虫中Selenium的用法详解
2020/07/10 Python
HTML5如何使用SVG的方法示例
2019/01/11 HTML / CSS
CHARLES & KEITH台湾官网:新加坡时尚品牌
2019/07/30 全球购物
俄罗斯大型在线书店:Читай-город
2019/10/10 全球购物
阿里巴巴英国:Alibaba英国
2019/12/11 全球购物
信息部岗位职责
2013/11/12 职场文书
大学秋游活动方案
2014/02/11 职场文书
法律专业求职信
2014/05/24 职场文书
离婚协议书怎么写
2015/01/26 职场文书
干部考核工作总结
2015/08/12 职场文书
Nginx缓存设置案例详解
2021/09/15 Servers
一起来学习Python的元组和列表
2022/03/13 Python
剑指Offer之Java算法习题精讲二叉树的构造和遍历
2022/03/21 Java/Android
APP界面设计技巧和注意事项
2022/04/29 杂记