0

这是一个简单但有趣的问题。假设我有各自类的两个部分,.toggle0并且.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隐藏,.footer1但 单击某些标签时.toggle0不显示和.toggle1隐藏.footer0。似乎第二次点击事件优先于第一次

4

2 回答 2

1

单击处理程序中的i直到单击时才被评估,此时该值已从绑定处理程序时发生更改。如果你想走这条路,你需要创建一个闭包。这是一种方法:

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 回答