[Javascript]jQueryで二度押し防止対策のプラグイン
そんなに難しくないので自分で書いてみた.
Gistに公開しているのでご自由にどうぞ.
jquery.singleclick.js · GitHub
(function($) { var lockKey = 'clickLockedId'; $.fn.releaseClickLocked = function(){ var tid = this.data(lockKey); if(tid!==undefined){ clearTimeout(tid); } $(this).removeData(lockKey); }; $.fn.singleClick = function(handler, timeout) { timeout = timeout===undefined ? 3000:timeout; $(this).click(function(evt){ var self = $(this); if(self.data(lockKey)!==undefined){ return false; } var tid = setTimeout(function(){ self.releaseClickLocked(); },timeout); self.data(lockKey, tid); return handler.apply(this,[evt]); }); }; })(jQuery);
使い方
以下はリンクをクリックしまくった時の挙動がコメントで説明しています.
// 3秒間に1度だけコールされます. $('a.sample1').singleClick(function(evt){ alert('foo'); }); // 1秒間に1度だけコールされます. $('a.sample2').singleClick(function(evt){ alert('foo'); }, 1000); // releaseClickLockedはタイムアウトを待たずにロックを解除します. $('a.sample3').singleClick(function(evt){ var self = $(this); setTimeout(function(){ self.releaseClickLocked(); },1000); });