js 防止表單被重複提交

相信程序員都遇到過這種情況,當網速慢的時候,心急的瀏覽者會連續點擊提交按鈕,這時就容易產生表單被重複提交的效果,那麼我們該如何來防止呢,方法很多,下面我來說下我的預防方法:

將下列代碼拷到<head>區域中

代碼:
<script langauge="javascript">
<!--
 function checksub()
 {
  document.form1.btn1.disabled = true;
  document.form1.btn1.value="信息提交中,請稍候...";
  document.form1.submit();
 }
//-->
</script>



將下列代碼拷到<body>區域中

代碼:
<form method="post" id="form1" name="form1" action="#">
<input type="button" name="btn1" value="提交" οnclick="checksub();">
</form>


簡單吧,防止表單重複提交就這樣被實現了,其實你還可以做2張圖片,一個是提交按鈕的圖片,一個是信息提交中的gif圖片,信息提交中帶點兒動畫效果,效果會更好。如果用圖片代碼應該爲

代碼:
<script langauge="javascript">
<!--
 function checksub()
 {
  document.getElementById("btn1").src="信息提交中圖片路徑";
  document.form1.submit();
  document.getElementById("btn1").οnclick="";
 }
//-->
</script>

<form method="post" id="form1" name="form1" action="#">
<img id="btn1" src="提交按鈕圖片" οnclick="checksub();">
</form>

發佈了37 篇原創文章 · 獲贊 9 · 訪問量 8萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章