精华内容
下载资源
问答
  • validate

    2017-05-22 10:28:24
    validate

    使用JQuery validate插件验证表单

    常见的表单验证插件:
    - validate
    - Zebra Form
    - jFormer
    - jQuery.validVal
    - Validity
    - ValidForm Builder
    - Ketchup
    - Validatious
    - Form Validator

    浅析JQuery Validate插件:

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息,且已翻译成其他 37 种语言。

    jQuery Validate插件的使用:

    • 下载jQuery validate插件
      jQuery validate官网: https://jqueryvalidation.org/

    • 将validate引入你的项目

    • 这里写图片描述
    • 将需要用到的jquery.js ,jquery.validate.min.js也引入页面,同时将location包下的message_zh.js也引入你的页面,因为默认的错误提示是英文版,故引入中文版本地化文件,在你没有定义错误提示的情况下,将使用默认中文版错误提示。
    <script type="text/javascript src="validate/lib/jquery.js"></script>
    <script type="text/javascript"
        src="validate/dist/jquery.validate.min.js"></script>
    <script type="text/javascript"
        src="validate/dist/localization/messages_zh.js"></script>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 编写javascript验证方法
    <script type="text/javascript">
        $().ready(function() {
            // 在键盘按下并释放及提交后验证提交表单
            $("#RegisterForm").validate({
                rules : {
                    name : {
                        required : true,
                    },
                    phone : {
                        required : true,
                        minlength : 11,
                        isMobile:true
                    },
                    password : {
                        required : true,
                        minlength : 5
                    },
                    confirmpass : {
                        required : true,
                        minlength : 5,
                        equalTo : "#password"
                    }
                },
                messages : {
                    name : {
                        required : "请输入用户名",
                    },
                    phone : {
                        required : "请输入手机号码",
                        minlength : "手机号码长度不能小于 11 ",
                        isMoblie:"请正确填写您的手机号码"
                    },
                    password : {
                        required : "请输入密码",
                        minlength : "密码长度不能小于 5 个字母"
                    },
                    confirmpass : {
                        required : "请输入密码",
                        minlength : "密码长度不能小于 5 个字母",
                        equalTo : "两次密码输入不一致"
                    }
                }
            });
        })
    </script>

    • 因为jQuery validate API没有对手机号码的验证,但是提供自定义验证的方法addMethod:name, method, message,所以自定义验证手机号码的方法。
    <script type="text/javascript">
        //手机号码验证
        jQuery.validator
                .addMethod(
                        "isMobile",
                        function(value, element) {
                            var length = value.length;
                            var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
                            return this.optional(element)
                                    || (length == 11 && mobile.test(value));
                        }, "请正确填写您的手机号码")
    </script>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 修改默认提示的样式,默认提示字体是黑色,可以将其设置为红色,jQuery validate默认将错误提示写在中,故可以修改如下:
    <style type="text/css">
    form label.error {
        width: 200px;
        margin-left: 8px;
        color: Red;
    }
    </style>
    
    

    结果如下:
    这里写图片描述

    • 总结:
      表单是每一个项目中必不可少的一部分,只要有表单就要有对表单的验证,然而表单的验证是一件很繁琐的事情,因此出现了很多的已封装好的对表单验证的插件,能很好地利用插件对我们项目的开发是相当有益处的。笔者对项目中用到的jQuery validate插件做以简单的总结,有错误之处,还请指教。
      注:根据表单元素的name属性

      -更多jQuery validate 参考资料

      https://jqueryvalidation.org/

    展开全文
  • jQueryValidate

    2017-10-18 09:38:52
    jQueryValidate 使用实例,挺全的。jQueryValidate 使用实例,挺全的。
  • Validate表单验证

    万次阅读 多人点赞 2018-11-28 20:15:33
    validate 一、 validate的使用步骤 引入jquery.min.js 引入 jquery.validate.js 页面加载后对表单进行验证 $("#表单id名").validate({}) 在validate中的rules中编写验证规则(格式如下) 字段的name...

    validate

    一、 validate的使用步骤

    1. 引入jquery.min.js
    2. 引入 jquery.validate.js
    3. 页面加载后对表单进行验证 $("#表单id名").validate({})
    4. 在validate中的rules中编写验证规则(格式如下)
      • 字段的name属性:“校验器”(tisps:一个输入框只有一个校验器的时候使用
      • 字段的name属性:{校验器:值,校验器:值}(tips:输入框需要有多个校验器的时候使用)
    5. 在validate中的messages中编写提示信息(tips格式与rules相对应)
    6. 在validate中的submitHandler中编写验证通过执行的内容

    图示如下:
    在这里插入图片描述

    案例代码如下

    <!DOCTYPE html>
    <html>
    <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="scripts/common/jquery.min.js"></script>
    <script type="text/javascript" src="scripts/common/jquery.validate.js"></script
    <script type="text/javascript">
    	 $("#zhuce").validate({
                rules:{
                    regist_username:{
                        required:true
                       /* remote:{
                            type: "post",url: url,
                            data:{
                                userName:function () {
                                    return $("regist_username").val();
                                }
                            }
                        }用ajax判断数据库中用户名是否存在*/
                    },
                    regist_password:{
                        required:true,
                        minlength:6
                    },
                    final_password:{
                        equalTo:"#regist_password"
                    }
                },
                messages:{
                    regist_username:{required:"用户名不能为空"},
                    regist_password:{required:"密码不能为空",minlength:"密码最小的长度为6"},
                    final_password:{equalTo:"两次密码不一致"}
                },
                submitHandler: function () {
                //验证通过后进行注册
                    register();
                }
            })
      </script>
    </head>
    <body>
      <form id="zhuce">
                <dl>
                    <dt>
                        <div class='header'>
                            <h3>&nbsp;</h3>
                        </div>
                    </dt>
                    <dt></dt>
                    <dt>
                        <div class='letter'>
                            <label for="regist_username">用户名:&nbsp;</label>
                            <input type="text" name="regist_username" id="regist_username" tabindex='5'/>
                        </div>
                    </dt>
                    <dt>
                        <div class='letter'>&nbsp;&nbsp;&nbsp;:&nbsp;<input type="text" name="nickname" id="nickname" tabindex='6'/>
                        </div>
                    </dt>
                    <dt>
                        <div class='letter'>
                            <label for="regist_password">&nbsp;&nbsp;&nbsp;:&nbsp;</label>
                           <input type="password" name="regist_password" id="regist_password" tabindex='7'/>
                        </div>
                    </dt>
                    <dt>
                        <div class='password'>
                            <label for="final_password">&nbsp;&nbsp;&nbsp;确认密码:&nbsp;</label>
                            <input type="password" name="final_password" id="final_password" tabindex='8'/>
                        </div>
                    </dt>
                    <dt>
                        <div>
                            <input type="submit" name="" id="regist_button" value='&nbsp注&nbsp册&nbsp' tabindex='9'/>
                            <input type="button" name="" id="back" value='&nbsp返&nbsp回&nbsp' tabindex='10'/>
                        </div>
                    </dt>
                </dl>
            </form>
    </body>
    </html>
    

    默认校验规则

    序号 校验类型 取值 描述
    1 required true&false 必须填写的字段
    2 email “@”&“email” 必须输入正确格式的电子邮件
    3 remote url路径 使用ajax进行验证
    4 date 数字 正确格式日期 tips:ie6有bug
    5 dateISO 字符串 正确格式的日期 例如:2018-11-28,2018/11/28 tips:只验证格式,不验证有效性
    6 number true&false 合法的数字
    7 digits true&false 整数
    8 creditcard true&false 合法的信用卡号
    9 equalTo JQuery表达式(eg:"#regist_password") 输入值必须和 #regist_password相同。
    11 maxlength 数字 最大长度
    12 minlength 数字 最小长度
    13 rangelength [min,max] 输入长度必须在 min和 max之间的字符串(tips:汉字算一个字符
    14 range [min,max] 输入值必须在 min和 max之间的数字
    15 max :n 最大值不能大于n
    16 min :n 最小值不能小于n
    展开全文
  • jQuery validate 中文API 附validate.js中文api手册
  • validateform

    2011-09-23 11:29:17
    validate formvalidate formvalidate form
  • jquery.validate是一个基于jquery的非常优秀的验证框架,我们可以通过它迅速验证一些常见的输入,并且可以自己扩充自己的验证方法,而且对国际化也有非常好的支持,通过本文给大家介绍jquery.validate 自定义验证方法...
  • validate 插件

    2021-02-09 11:29:48
    1、validate简介 2、validate使用步骤 3、validate校验规则 4、validate使用 validate插件所需文件下载链接: validate插件所需文件. 5、validate示例代码 <!DOCTYPE html> <html> <...
    1、validate简介

    在这里插入图片描述


    2、validate使用步骤

    在这里插入图片描述


    3、validate校验规则

    在这里插入图片描述


    4、validate使用

    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

    5、validate示例代码
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<style type="text/css">
    			.error{color:#f00; font-size: 12px;}
    		</style>
    	</head>
    	<body>
    		<!--引入jQuery-->
    		<script type="text/javascript" src="jquery-3.4.1.min.js"></script>
    		<!--引入validate-->
    		<script type="text/javascript" src="validate.min.js"></script>
    		<!--引入validate中文-->
    		<script type="text/javascript" src="messages_zh.js"></script>
    		
    		<script type="text/javascript">
    			$(function(){
    				$("#frm").validate({
    					//为控件添加规则和提示信息
    					rules:{
    						//为usrname添加规则
    						usrname:{
    							required:true,
    							maxlenght:10
    						}
    					},
    					//为usrname添加自定义提示信息
    					messages:{
    						usrname:"必填且长度不超过10个字符"
    					}
    				});
    			});
    		</script>
    		<form id="frm" action="test.html">
    			username:<input type="text" name="usrname"><br>
    			userpass:<input type="password" name="usrpass"  required="required"><br>
    			<input type="submit" value="登录">
    		</form>
    		
    	</body>
    </html>
    
    
    展开全文
  • jQuery Validate

    2010-08-22 23:41:14
    jQuery Validate jQuery Validate jQuery Validate jQuery Validate jQuery Validate
  • Validate压缩包下载

    2017-07-13 16:56:20
    jquery各版本,validate,以及validate语言包
  • validate实例

    2014-08-11 13:30:14
    一个简单地登陆页面的验证实例。采用jquery validate插件
  • validate-value根据JSON模式验证值。 状态 类别 状态 版 依存关系 开发依赖 建立 执照 安装 $ npm install validate-value 快速开始 首先,您需要将validate-value集成到您的应用程序中: const { Value , ...
  • Vee Validate进行Laravel后端验证 简单的vue js插件,通过使用vee-validate可以更轻松地显示Laravel验证中的验证错误。 入门 在脚本入口点: import Vue from 'vue' ; import VeeValidate from 'vee-validate' ; ...
  • js validate

    2019-12-24 17:29:00
    表单校验 1 编写的表单验证程序 ... //在此增加了一个return,返回的是一个validate对象,这个对象有一个form方法,返回的是是否通过验证 return $("#aaa").validate({ rules : { name : { ...

    表单校验

    1 编写的表单验证程序

    function validform(){
            //在此增加了一个return,返回的是一个validate对象,这个对象有一个form方法,返回的是是否通过验证
            return $("#aaa").validate({
                rules : {
                    name : {
                        required : true
                    },
                    type : {
                        required : true
                    },
                    info : {
                        maxlength: 1000
                    },
                    remark : {
                        maxlength : 1000
                    }
                },
                messages : {
                    name : {
                        required : "请输入平台名称"
                    },
                    type : {
                        required : "请选择保额获取类型"
                    },
                    info : {
                        maxlength : "最多输入一千个字"
                    },
                    remark : {
                        maxlength : "最多输入一千个字"
                    }
                }
            });
        };
    
    // 点击事件
    $("#bbb").click(function(){
    
            if(validform().form()) {// 调用form方法,表单校验,成功调用ajax
                // 表单提交, 新增平台
                var addPlatformData = $("#addPlatformForm").serialize();
                $.ajax({
                    type : 'post',
                    url : '${basePath}/platform/add',
                    dataType : 'json',
                    data : addPlatformData,
                    success : function(data) {
                        if (data.code == 1) {
                            window.location.href = "${basePath}/platform/handlesuccess?flag=1&seplatformno="
                                    + data.data.seplatformno;
                        } else {
                            alert(data.message);
                        }
                    }
                });
            }
        });
    

    在这里插入图片描述
    参考:
    https://www.cnblogs.com/g-smile/p/9159549.html

    展开全文
  • validate插件

    2017-06-13 21:06:30
    通过validate插件来校验表单 技术分析: jqery validate validate使用步骤: validate是别人封装好的第三方工具 1.导入jquery.js 2.导入validate.js 3.在页面加载成功之后 对表单进行校验 $("选择器").validate...
  • validate概述 validate: jquery的一个插件,依赖jquery使用,Validation是历史最悠久的jQuery插件之一,经过了全球范围内不同项目的验证,并得到了许多Web开发者的好评。作为一个标准的验证方法库,Validation拥有...
  • Validate验证

    2019-06-26 16:34:13
    Validate.isTrue(!(n != 1 && n != 2 && n != 4 && n != 5), "查询类型有误~"); Validate.isTrue(!StringUtils.isEmpty(currentUserId), "当前操作人信息有误"); ...
  • jQuery_validate

    2014-07-10 11:17:10
    jQuery_validate js插件 jQuery_validate
  • laravel validate验证参数说明

    千次阅读 2020-10-24 19:40:15
    laravel validate验证参数说明 validate的介绍 validate的使用 validate验证参数说明
  • <div><p>(Instead of validate_ports. validate_port_spec validates the port specifications that can be specified on the calicoctl command line. This is different from validate_ports, which validates the...
  • 余烬验证 该ember插件允许在应用程序中使用库。 安装 与其他任何插件一样: ...import validate from 'validate'; 然后,您可以像在一样使用validate对象。 进一步阅读 学分 此插件的灵感来自 ,它实现了类似的目的。
  • validate-spring-boot-starter latest=1.2.0 中央仓库 maven <groupId>com.github.liangbaika</groupId> <artifactId>validate-spring-boot-starter <version>{latest} gradle compile group: '...
  • validate_email, Validate_email验证电子邮件地址是否有效并且确实存在 Validate_emailValidate_email是 python的包,它检查电子邮件是否有效,格式正确,确实存在。安装首先,你必须:pip install validate_email要...
  • validate如何使用

    2021-01-27 06:26:40
    一、 validate的使用步骤 引入jquery.min.js 引入 jquery.validate.js 页面加载后对表单进行验证 $("#表单id名").validate({}) 页面加载时,让validate生效。 在validate中的rules中编写验证规则(格式...
  • validate表单验证

    万次阅读 多人点赞 2017-10-04 22:53:02
    使用validate做表单验证,实现效果如图: 当然,也可以换成中文的(如果你觉得默认的提示信息不是你想要的,你也可以自定义提示信息) validate使用步骤: 1.导入jquery.js 2.导入validate.js 3.在...
  • 在oracle中可以使用rman VALIDATE来检查数据库是否存在坏块,检测备份集是否有用,特别是备份集,建议定期做VALIDATE 验证,避免备份失败造成数据库损失。1.VALIDATE DATABASE.在11g数据库中可以使用VALIDATE ...
  • jQuery、validatevalidate中文提示文件
  • 一、jQuery.validate简介  jQuery.validate.js插件用于对表单输入进行验证,其使用配置非常简单。支持多事件触发,自带多种验证规则,还支持自定义验证规则。 1、配置方法  先导入jQuery库,然后导入Validate插件...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 73,642
精华内容 29,456
热门标签
关键字:

validate