防止重复提交_提交后禁用提交按钮、图片、超链接

最新推荐文章于 2024-07-26 11:09:07 发布

weixin_33881041

最新推荐文章于 2024-07-26 11:09:07 发布

阅读量101

点赞数

文章标签： javascript java ViewUI

View Code

<html>
<head>
<script type="text/javascript">
function doSubmit(){
   var subtn = document.getElementById("finishbtn");
    subtn.disabled = true;//让按钮不可点击
    
    var aa =  document.getElementById("test").value;
    if(aa == ""){
       alert("不能为空");
       subtn.disabled = false;//让按钮不变灰色，可点击
       return false;
    }
    window.location="b.html";
  }
</script>
</head>
<body>
<!--return false; 防止表格自动提交-->
<form onsubmit="return false;">
<input type="text" id="test" value=""/>
<input name="finishbtn" id="finishbtn" type="button" value="保存"
                                        onClick="doSubmit()" class="" />
</form>

</body>
</html>

两种表单提交方式,一种是普通按钮的提交，一种是submit的按钮提交

View Code

<html>
<head>
<script type="text/javascript">
function doSubmit(){
   var subtn = document.getElementById("finishbtn");
    subtn.disabled = true;//让按钮不可点击
    
    var aa =  document.getElementById("test").value;
    if(aa == ""){
       alert("不能为空");
       subtn.disabled = false;//让按钮不变灰色，可点击
       return false;
    }
    window.location="b.html";
  };
  
  function check(){
   var aa =  document.getElementById("test2").value;
    if(aa == ""){
       alert("不能为空");
       return false;
    }
    return true;
  };
</script>
</head>
<body>
<!--return false; 防止表格自动提交-->
<form onsubmit="return false;">
<input type="text" id="test" value=""/>
<input name="finishbtn" id="finishbtn" type="button" value="保存"
                                        onClick="doSubmit()" class="" />
</form>

<form onsubmit="return check()"  action="b.html">
<input type="text" id="test2" value=""/>
<input name="finishbtn" id="finishbtn" type="submit" value="保存"
/>
</form>

</body>
</html>

图片也可以提交，用法跟submit按钮一模一样

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <base href="<%=basePath%>">
        <title>登录</title>
        <script type="text/javascript">         
             function check(){
                 var aa = document.form1;
                 if( "" == aa.username.value) {
                        alert("用户名为空");
                        return false;
                 }

                 if( "" == aa.pwd.value) {
                     alert("密码为空");
                     return false;
                 }
                return true;
             };

             function dobutton(){
                 var aa = document.form2;
                 if( "" == aa.username.value) {
                        alert("用户名为空");
                        return false;
                 }

                 if( "" == aa.pwd.value) {
                     alert("密码为空");
                     return false;
                 }
                 
                 window.location='SysServlet/login.sys';
             };

             function dosubmit(){
                 var aa = document.form3;
                 if( "" == aa.username.value) {
                        alert("用户名为空");
                        return false;
                 }

                 if( "" == aa.pwd.value) {
                     alert("密码为空");
                     return false;
                 }
                 return true;
             };
        </script>
    </head>
    <body>
        
        <div align="center">
            <form name="form0" action="SysServlet/login.sys">
                用户名：
                <input type="text" name="username"/>
                密码：
                <input type="text" name="pwd"/>
                <input type="image"  src="img/login.jpg"/>
            </form>
        </div>
        
        <div align="center">
            <form onsubmit="return check()" name="form1" action="SysServlet/login.sys">
                用户名：
                <input type="text" name="username"/>
                密码：
                <input type="text" name="pwd"/>
                <input type="image"  src="img/login.jpg"/>
            </form>
        </div>
        
        <div align="center">
            <form name="form2">
                用户名：
                <input type="text" name="username"/>
                密码：
                <input type="text" name="pwd"/>
                <input type="button"  value="button按钮登录" onclick="dobutton()"/>
            </form>
        </div>
        
        <div align="center">
            <form action="SysServlet/login.sys" onsubmit="return dosubmit();" name="form3">
                用户名：
                <input type="text" name="username"/>
                密码：
                <input type="text" name="pwd"/>
                <input type="submit"  value="submit按钮登录"/>
            </form>
        </div>
    </body>
</html>

View Code

超链接：

<form action="/search/full_text_search.action" id="fmUpload" method="post" >

 <a href="#" onclick="javascript:submitForm();"><img src="../../images/index_132.jpg"/> </a>

        var submitFlag;
    function submitForm() {
        if(submitFlag != true){
            alert("提交成功!");
            $("#fmUpload").submit();
            submitFlag = true;
        }
    }

weixin_33881041

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
防止重复提交_提交后禁用提交按钮、图片、超链接

View Code &lt;html&gt;&lt;head&gt;&lt;script type="text/javascript"&gt;function doSubmit(){ var subtn = document.getElementById("finishbtn"); subtn.disabled = true;//让按钮不可点击 ...
复制链接

扫一扫