送信ボタン連打防止スクリプト

2006–10–27

送信ボタンの連打防止スクリプト。1フォーム複数ボタンに対応。

1. ボタンクリック
2. submitとimageとresetを無効にする（複数可）
3. フォーム送信

...みたいな流れ。用途としては、主に処理待ち中に送信ボタンを連打することによって起こる、複数投稿を回避する目的で使う。

HTML

1. <form action="" method="get" onsubmit="return onceOnly(this);">
2. <fieldset>
3. <legend>テストフォーム</legend>
4. <p>
5. <input type="text" name="test" value="" />
6. <input type="submit" value="送信" />
7. <input type="reset" value="取消" />
8. <input type="image" src="" alt="画像" />
9. </p>
10. </fieldset>
11. </form>

Script

1. var exec = false;
2.  
3. function onceOnly(thform) {
4. if(exec == true){ return false; };
5.  
6. exec = true;
7. obj = thform.getElementsByTagName('input');
8. for (i=0; i < obj.length; i++) {
9. if((obj[i].type) == 'submit' ||
10. (obj[i].type) == 'image' ||
11. (obj[i].type) == 'reset') {
12. obj[i].disabled = true;
13. };
14. };
15. alert('ボタン、無効になってるでしょ？');
16. return true;
17. };

memo: alertはチェック用なので、実用の際は外したほうが良いでしょう。

postscript: 改訂版をアップしました。

Posted in /web/javascript
ブックマークする: