zoukankan      html  css  js  c++  java
  • 两种类型的表单提交

    1.原始的

    <form method="post" action="/student/stureg/add" id="form1" onsubmit="return subForm();">
    <button type="submit" class="button red" style="font-size:18px; font-family:'微软雅黑';">提&nbsp;交</button>

    这里的button提交之后,执行subForm()方法,subForm可以对表单进行验证,返回false,表单不提交。否则提交。

    function subForm()
    {
        var flag = true;
        $(".required").each(function(){
            if(!$(this).val())
            {
                flag = false;
                $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
                $(this).attr("status","1").val("此处为必填项,请您填写!");
            }
        });
    
      /*$(".idCardNo").each(function(){
        if(!idCardNo($(this).val()))
        {
          flag = false;
          $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
          if($(this).attr("status")!=1){
            $(this).attr("status","1").val("请填写正确的身份证号码!");
          }
        }
      });*/
    
      var reg = new RegExp("^[0-9]*$");
      $(".number").each(function(){
        if(!reg.test($(this).val()))
        {
          flag = false;
          $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
          if($(this).attr("status")!=1){
            $(this).attr("status","1").val("请填写正确的联系电话!");
          }
        }
      });
      
    
      $(".exCardNo").each(function(){
        if(exCardNo($(this).val())==1)
        {
          flag = false;
          $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
          if($(this).attr("status")!=1){
            $(this).attr("status","1").val("此身份证已报名!");
          }
        }
      });
        return flag;
    }

    各种验证!

    2.js设置的提交

    <form method="post" action="/student/stureg/reglogin" id="form_login">
    <a id="submit"><img src="/images/login/login_bt.png" style="cursor:pointer"/></a>

    这里并不是提交按钮,而是一个模拟提交的按钮。

    $("#submit").click(function(){
          if(loginForm())
          {
             $("#form_login").submit();
          }
        });
    

      触发提交事件,这里用

    onsubmit="return loginForm();"就没效果了,不管是否返回false都会提交。所以要在真正提交之前,做一下验证。
    function loginForm(){
      var flag = true;
      $(".notnull").each(function(){
        if(!$(this).val())
        {
          flag = false;
          $(this).css({ border: "1px solid #F56939",borderRadius:"5px",color:"#F56939",height:"26px"});
          $(this).attr("status","1").val("不能为空");
        }
      });
      return flag;
    }

    返回false,就不调用submit方法。

    这就是两种处理表单提交前奏的方式。

     
  • 相关阅读:
    关于苹果IPhone/Ipad(IOS)开发者证书申请及安装、真机调试、发布的参考文章
    vs 关闭警告
    真机测试及布署Code Sign error问题总结
    在 Win32 Application 和 Win32 Console Application 中使用 MFC
    获取应用程序路径的区别
    js日期控件
    SQL SERVER 企业管理器 MMC 无法创建管理单元
    进程查看两利器
    用PowerDesigner逆向数据库工程时”Unable to list the table"错误的解决方法
    SQL 附加无日志数据库
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/3597546.html
Copyright © 2011-2022 走看看