• js 在表单提交前进行操作


    最近在写页面的时候,需要手动写一些在表单进行提交前的验证操作,正好看到了2种阻止表单提交的方法,可以进行一些逻辑处理

    方法一:使用return false

    原生js写法:
    <form id="loginForm" name="loginForm" action="login.aspx" method="post">
     <button type="submit" value="Submit" id="submit">Submit</button>
    </form>
    
    <script>
     var submitBtn = document.getElementById("submit");
    
     submitBtn.onclick = function (event) {
      alert("preventDefault!");
      return false;
     };
    </script>
    
    jquery写法:
    <script>
    $("#loginForm").submit(function(){
    if(条件){
        //此处这里进行逻辑处理
    }else{
        return false;
    }
    })
    </script>
    
    //这里发现的一个问题就是,在用jq写法的时候,只要不返回false,逻辑处理完也会自动提交表单

    方法二:使用preventDefault()

    <form name="loginForm" action="login.aspx" method="post">
     <button type="submit" value="Submit" id="submit">Submit</button>
    </form>
    
    <script>
     var submitBtn = document.getElementById("submit");
    
     submitBtn.onclick = function (event) {
      alert("preventDefault!");
      var event = event || window.event;
      event.preventDefault(); // 兼容标准浏览器
      window.event.returnValue = false; // 兼容IE6~8
     };
    </script>
    Ink.Flower@china
  • 相关阅读:
    Mysql配置文件模板
    shell命令记录
    SuSE Linux Enterprise Server
    安装jdk1.8
    云南-第一个应用节点-ssh登录-卡顿的问题
    Python重新安装pip
    Centos6.5修改镜像为国内的阿里云源
    supervisord.conf
    Pandas连接Mysql数据库
    Vim速查命令简版
  • 原文地址:https://www.cnblogs.com/inkflower/p/7085584.html
Copyright © 2020-2023  润新知