LoginSignup
15
19

More than 5 years have passed since last update.

jquery eachメソッドのコールバック関数に引数を渡す方法

Last updated at Posted at 2015-08-06

elemクラスのdivがいくつか並んでいて、

<div class="elem" id="1">
<div class="elem" id="2">
<div class="elem" id="3">

クリックしたらabcクラスをつけ、
そうじゃないdivからはabcクラスを外すような処理を書きたい場合に

  $(".elems").click(function(){
    var arg = $(this).prop("id");
    $(".elems").each(function(){
       //処理
       // この中で argを読んでもundifinedになる 
    });
  });

と書くと、引数を渡すことが出来ない。
以下のようにクロージャにぶっこんでいやると引数を渡すことが出来る

  var callbackMethod = function (id) {
    return function(index, element){
      var tmp_id = $(this).prop("id");
      if(tmp_id == id ){
        $(this).addClass("abc");
      }else{
        $(this).removeClass("abc");
      }
    };
  };

  $(".elems").click(function(){
    var arg = $(this).prop("id");
    $(".elems").each(callbackMethod(arg));
  });

jQueryだよりにコード書いてると辛い時があるよねってお話でした。
もっとクールに書く方法もきっとあるはず

ref: http://stackoverflow.com/a/23357268/4480860

15
19
7

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
19