DDR爱好者之家

一个JavaScript防止表单重复提交的实例
站长资源 2025/1/24 佚名
16 1538
DDR爱好者之家 Design By 杰米
<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>防止重复表单提交</title> 
<style> 
#refresh{ 
display: none; 
width:200px; 
height:20px; 
background-color: #ff0; 

} 

</style> 

<script> 
var inprocess = false; 
window.onload = function(){ 

document.forms["picker"].onsubmit = validateSubmit; 
document.getElementById("refresh").onclick = startOver; 
} 
function validateSubmit () { 
// 防止重复的表单提交 
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>"; 
return false; 
} 
function startOver(){ 
inprocess = false; 
document.getElementById("submitbutton").disabled = false; 
document.getElementById("message").innerHTML = ""; 
document.getElementById("refresh").style.display = "none"; 

} 
</script> 
</head> 

<body> 

<form id="picker" method="post" action=""> 
group1:<input type="radio" name="group1" value="one" /> 
group2:<input type="radio" name="group1" value="two" /> 
group3:<input type="radio" name="group1" value="three" /><br /><br /> 
Input 1: <input type="text" id="intext" /> 
Input 2: <input type="text" id="intext2" /> 
Input 3: <input type="text" id="intext3" /> 
<input type="submit" id="submitbutton" value="send form" /> 
</form> 
<div id="refresh"> 
<p>单击我</p> 
</div> 
<div id="message"></div> 
</body> 
</html>
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米