zoukankan      html  css  js  c++  java
  • jQuery:validate表单验证基本使用

    jquery.validate是jquery的一个验证框架,可以迅速验证一些常见的输入,并且可以自己扩充自己的验证方法!

    这里先从介绍简单的使用方法:jquery.validate.js下载地址

    1、导入js库

    js库+ jquery.validate.js

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.validate.js"></script>

    2、 验证表单:

    <form action="" method="get" id="checkform">
    姓名:<input type="text" name="name" required/>
    邮箱:<input type="email" name="email"  />
    <input type="submit" value="提交" />
    </form>

    3、执行:

    <script>
    $("#commentForm").validate();
    </script>

    4、拓展验证:jquery.validate.js里面的message有什么验证内容type和name值改成相应的值,如:下面的date

          <input id="new" type="date" name="date"/>

    5、修改验证提示:引入messages_cn.js:

    jQuery.extend(jQuery.validator.messages, { 
    required: "必选字段",                                 
    remote: "请修正该字段",                             
    email: "请输入正确格式的电子邮件", 
    url: "请输入合法的网址", 
    date: "请输入合法的日期", 
    dateISO: "请输入合法的日期 (ISO).", 
    number: "请输入合法的数字", 
    digits: "只能输入整数", 
    creditcard: "请输入合法的信用卡号", 
    equalTo: "请再次输入相同的值", 
    accept: "请输入拥有合法后缀名的字符串", 
    maxlength: jQuery.validator.format("请输入一个长度最多是 {0} 的字符串"), 
    minlength: jQuery.validator.format("请输入一个长度最少是 {0} 的字符串"), 
    rangelength: jQuery.validator.format("请输入一个长度介于 {0} 和 {1} 之间的字符串"), 
    range: jQuery.validator.format("请输入一个介于 {0} 和 {1} 之间的值"), 
    max: jQuery.validator.format("请输入一个最大为 {0} 的值"), 
    min: jQuery.validator.format("请输入一个最小为 {0} 的值") 
    }); 

    或不引入直接修改,如:

    $("#checkform").validate({
     messages: {
            email: "请填写邮箱邮箱"
        }
    });

    Demo下载 >>>

    备:如果使用class="{}"的方式放正则,必须引入包:jquery.metadata.js,这里暂不演示

  • 相关阅读:
    C#---将数据库数据转换为json格式
    ASP.NET ---根据值让树中某一节点选中
    SQL---查询树中某个节点及其所有子节点
    CSS---相对定位笔记
    CSS---绝对定位笔记
    滑雪
    Self Numbers
    Lotto
    Parencodings
    Robot Motion
  • 原文地址:https://www.cnblogs.com/tinyphp/p/3310398.html
Copyright © 2011-2022 走看看