0

これは単純ですが興味深い問題です。それぞれのクラス.toggle0との 2 つのセクションがある.toggle1とします。あるタグをクリックすると.toggle0表示と非表示を切り替えたいとします。これで、このコードは正しく動作します.toggle1.footer0.toggle1.toggle0.footer1

$('.toggle1').hide();
  var i=0;
    $(".footer"+i+"").click(function(){
        $(".toggle"+(i+1) %2+"").hide();
        $(".toggle"+i+"").show();
    });
  var j=1;
    $(".footer"+j+"").click(function(){
        $(".toggle"+(j+1) %2+"").hide();
        $(".toggle"+j+"").show();
    });

しかし、これはクリックイベントで何も起こらないという意味では機能しません

for(var i=0;i<2;i++){
    $(".footer"+i+"").click(function(){
            $(".toggle"+(i+1) %2+"").hide();
            $(".toggle"+i+"").show();
        });
}

これを入れたら

      $('.toggle1').hide();
      var i=0;
        $(".footer"+i+"").click(function(){
            $(".toggle"+(i+1) %2+"").hide();
            $(".toggle"+i+"").show();
        });
       i =1;
        $(".footer"+i+"").click(function(){
            $(".toggle"+(i+1) %2+"").hide();
            $(".toggle"+i+"").show();
        });

.toggle1一部のタグをクリックすると表示および非表示になりますが .toggle0、一部のタグをクリックすると表示および非表示になりません。2番目のクリックイベントが最初のクリックイベントよりも優先されるようです.footer1.toggle0.toggle1.footer0

4

2 に答える 2

1

クリック ハンドラー内のiは、ハンドラーがバインドされた時点から値が変更された時点でクリックされるまで評価されません。このルートに進みたい場合は、クロージャーを作成する必要があります。これを行う 1 つの方法を次に示します。

for (var i = 0; i < 2; i++) {
    $(".footer" + i + "").click(function () {
        var idx = i;
        return function () {
            $(".toggle"+(idx+1) %2+"").hide();
            $(".toggle"+idx+"").show();
            console.log(idx);
        }
    }());
}
于 2013-08-23T17:53:08.343 に答える
0 
$('.footer0').click(function(){
  $('.toggle0 .toggle1').hide();
  $('.toggle0').show();
});
$('.footer1').click(function(){
  $('.toggle0 .toggle1').hide();
  $('.toggle1').show();
});
于 2013-08-23T17:51:06.640 に答える