suchen

Heim  >  Artikel  >  Web-Frontend  >  EasyUI Validatebox Verifizierung_Grundkenntnisse

EasyUI Validatebox Verifizierung_Grundkenntnisse

WBOY
WBOYOriginal
2016-05-16 15:03:061295Durchsuche
<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: ''
 }
})

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Eine kurze Analyse, wie Jquery feststellt, dass die Bildlaufleiste zum Ende der Seite gescrollt wurde, und die event_jquery ausführtNächster Artikel：Eine kurze Analyse, wie Jquery feststellt, dass die Bildlaufleiste zum Ende der Seite gescrollt wurde, und die event_jquery ausführt

In Verbindung stehende Artikel

Mehr sehen