<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"/>
<title>防止重复表单提交</title>
<style>
#refresh{
display:none;
width:200px;
height:20px;
background-color:#ff0;
}
</style>
<script>
varinprocess=false;
window.onload=function(){
document.forms["picker"].onsubmit=validateSubmit;
document.getElementById("refresh").onclick=startOver;
}
functionvalidateSubmit(){
//防止重复的表单提交
if(inprocess)return;
inprocess=true;
console.log(inprocess);
document.getElementById("submitbutton").disabled=true;
document.getElementById("refresh").style.display="block";
document.getElementById("message").innerHTML="<p>正在processing，稍等</p>";
returnfalse;
}
functionstartOver(){
inprocess=false;
document.getElementById("submitbutton").disabled=false;
document.getElementById("message").innerHTML="";
document.getElementById("refresh").style.display="none";
}
</script>
</head>
<body>
<formid="picker"method="post"action="">
group1:<inputtype="radio"name="group1"value="one"/>
group2:<inputtype="radio"name="group1"value="two"/>
group3:<inputtype="radio"name="group1"value="three"/><br/><br/>
Input1:<inputtype="text"id="intext"/>
Input2:<inputtype="text"id="intext2"/>
Input3:<inputtype="text"id="intext3"/>
<inputtype="submit"id="submitbutton"value="sendform"/>
</form>
<divid="refresh">
<p>单击我</p>
</div>
<divid="message"></div>
</body>
</html>
