zoukankan      html  css  js  c++  java
  • jquery validate触发表单验证

    jquery validate是常用的表单验证插件。遇到一个jquery validate表单验证不触发的问题

    目前写法:
    $(function(){
      $("#form").validate({
         rules : {
                themeColor: {
                    required : true
                },
                ……
            },
            messages : {
                themeColor: {
                    required : '必填',
                },
                ……
            }
      });
    });

    <div class="btnWrap">
    <button type="button" class="btn btn-block btn-radius btn-st btn-caution submit-btn " id="btn">上传
    </button>
    </div>

    点击上传按钮,触发表单验证,经测试验证无法触发。仔细研究使用方法发现,上面的写法只能使用submit才能触发。
    <div class="btnWrap">
    <button type="submit" class="btn btn-block btn-radius btn-st btn-caution submit-btn " id="btn">上传
    </button>
    </div>

    如想在普通按钮上实现触发表单验证,需稍作修改:
    //编写表单验证函数validform,在验证按钮注册按钮点击事件内调用验证函数对象
    function validform(){
      /*关键在此增加了一个return,返回的是一个validate对象,这个对象有一个form方法,返回的是是否通过验证*/
      return $("#form").validate({
         rules : {
                themeColor: {
                    required : true
                },
                ……
            },
            messages : {
                themeColor: {
                    required : '必填',
                },
                ……
            }
      });
    }
    //表单验证
    $(validform());
    以上部分已经实现匿名函数的作用,下面介绍如何通过普通按钮实现表单验证
    $("#btn").click(function(){
        if(validform().form()) {
            //通过表单验证,以下编写自己的代码
        } else {
            //校验不通过,什么都不用做,校验信息已经正常显示在表单上
        }
    });
  • 相关阅读:
    HFSS射频仿真设计实例大全
    微泡发生器流体动力学机理及其仿真与应用
    新版电工电子技能实训教程
    LED照明产品质量控制与国际认证
    3G核心网技术揭秘——CS,PS,IMS
    如何开家汽车配件店
    建筑钢结构焊接工程应用技术及案例
    复杂地质条件下深井超深井钻井技术
    Java基础10 接口的继承与抽象类
    eclipse代码自动提示设置、如何配置eclipse的代码自动提示功能(同时解决自动补全变量名的问题)?
  • 原文地址:https://www.cnblogs.com/iiot/p/6341217.html
Copyright © 2011-2022 走看看