Help us understand the problem. What is going on with this article?

廃止されたtoggle()の、クロージャーによる代替実装方法

More than 3 years have passed since last update.

いまさらだけど、
jQuery toggle() が1.9以降で廃止されている件について。
クリックされる度にループ的に一定の動作を繰り返すのに便利だっただけどなー、、、
ってことでそれを代替する方法。

もちろん、クリック回数を管理する変数をもって自前で実装すればよいだけなんだが、
そのためだけにローカル変数が増えるとか嫌。
・・・あ、クロージャー使えばよいじゃないか、という話のメモ。

toggle.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type='text/javascript' src='https://code.jquery.com/jquery-1.12.3.min.js'></script>
<script>

  // 実行例
  $(document).ready(function(){

    // 廃止されたtoggle()的な動作を実装したい時は、
    // 即時関数を用いて click() へbindする関数に対して
    // クロージャー変数を用いることで、スコープを閉じた実装が可能。
    (function(){
      var counter = 0;

      $("#id_button").click(function(){
        var target = $(this);

        counter++;
        switch( counter ){
          case 1:
            target.val("トグル1>>2");
            break;

          case 2:
            target.val("トグル2>>3");
            break;

          default:
            counter = 0;

            target.val("トグル3>>0");
            break;
            break;
        }

      });
    }());

  });

</script>
</head>
<body>
<form>
  <input id="id_button" type="button" value="トグル動作"></input>
</form>
</body>
</html>
hoshimado
趣味で日曜プログラミング。仕事はたぶんIT関連? この2016年春から、ふとJavaScript周りに興味が沸いたので、Webアプリベースで「自分が便利」ツール作成しつつ、その裏で「コピペで使えるコード」の共有と勉強を目的にQiitaに参戦。https://twitter.com/hoshimado7
http://fluorite.halfmoon.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした