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 {
            //校验不通过,什么都不用做,校验信息已经正常显示在表单上
        }
    });
  • 相关阅读:
    Win7+Ubuntu11.10(EasyBCD硬盘安装)
    hdu 3661 Assignments
    hdu 1128 Self Numbers
    CF 152 B. Chilly Willy
    hdu 1754 I Hate It
    A survey of wireless network simulation and/or emulation software for use in higher education
    How to Fix Packet Loss: Causes, Simple Solutions & Top Tools
    getchar函数
    C++“左值”和“右值”
    stdio.h中的stdio
  • 原文地址:https://www.cnblogs.com/iiot/p/6341217.html
Copyright © 2011-2022 走看看