ValidateBox 验证框（表单验证）

最新推荐文章于 2019-04-24 17:01:45 发布

shabubusha

最新推荐文章于 2019-04-24 17:01:45 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery-easyui

本文链接：https://blog.youkuaiyun.com/shabubusha/article/details/29574177

jquery-easyui 专栏收录该内容

3 篇文章

订阅专栏

ValidateBox提供了多种验证规则，如email、url和length，允许自定义验证函数。例如，通过设置`required`、`validType`和`invalidMessage`属性实现表单字段的验证。可以扩展默认规则，如定义`minLength`验证类型，确保输入长度达到指定最小值。错误提示信息可以通过`invalidMessage`和`missingMessage`属性自定义。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

验证规则是通过使用 required 和 validType 特性来定义的，这里是已经实施的规则：

email：匹配 email 正则表达式规则
url：匹配 URL 正则表达式规则
length[0,100]：允许从 x 到 y 个字符
remote['http://.../action.do','paramName']：发送 ajax 请求来验证值，成功时返回 'true' 。

用法：

html部分：<input id="email" class="easyui-validatebox" required="true" validType="url" invalidMessage="邮箱格式不正确" missingMessage="null"/>

属性值：1、required：定义字段是否可以为空（true表示不可以）；

2、validType（要验证的数据类型，如：email、url、length[0,100]、remote）；

3、invalidMessage：文本框的内容不合要求时的提示文字；（不加这个属性的话，会有默认值）

4、missingMessage：文本框为空时的提示文字；

当然，也可以自定义验证规则，重写 $.fn.validatebox.defaults.rules ，来定义一个验证函数和无效的信息。例如，定义一个 minLength 验证类型：

例如：<input id="name" class="easyui-validatebox" required="true" validType="minLength[5]" invalidMessage="长度至少要5位"/>

   $.extend($.fn.validatebox.defaults.rules, {
           minLength: {
               validator: function(value, param){
                    return value.length >= param;
               },
               message: 'Please enter at least {0} characters.' （注意：数据类型不合要求时候的提示信息。这里是必须写的，但是如果属性“invalidMessage”有定义的话，这里的值会被覆盖掉，如果属性“invalidMessage”没有定义，则显示这里的提示文字）
          }
      });

</script>