画面上に設置したボタンを連続でクリックされた場合に予期しない挙動を引き起こす事が良くあります。
そういう場合の対応方法についてメモしておきます。
基本的に対応する方法としては以下の様な方法があります。

• ボタンのdisabled属性をtrueにする
• フラグを設置してクリックされたらフラグをfalseに設定してイベント処理されないようにバイパスする

以下はjQueryベースで連続クリックされた場合にフラグを使用して判定する方法です。

jQueryサンプル

JavaScript

// 連続クリック防止フラグ var clickFlg = true; jQuery(function($) { $(".button").on("click", function() { if(clickFlg) { // イベント処理中はフラグをoffにします。 clickFlg = false; // クリック処理を実施 } else { // イベント処理中は処理しない return false; } }); });

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

// 連続クリック防止フラグ var clickFlg = true; jQuery(function($) { $(".button").on("click", function() { if(clickFlg) { // イベント処理中はフラグをoffにします。 clickFlg = false; // クリック処理を実施 } else { // イベント処理中は処理しない return false; } }); });