jQuery クリックの連打対策をする方法を紹介

Last update 
/ Posted by Takumi Hirashima

jQuery でクリックの連打対策をする方法を紹介します。
クリックイベントなどで、処理を終わる前に再度クリックしてしまうと、もう一度イベントが実行され、意図した表示にならない場合があります。その際に、再度クリックした時の対処方法をコードに追加することで対応します。

対策方法

連打対策をしたい項目に .stop(true, false) を追加します。

$(function(){
  $("#button").click(function(){
    $(".block").stop(true, false).animate({width: "50%"}, 500)
    .animate({width: "100%"}, 500);
  });
});

まとめ

jQuery でクリックの連打対策をする方法を紹介しました。

この投稿では以下のサイトを参考にさせていただきました。合わせてご覧ください。

スポンサーリンク