jquery之这是在 jQuery 中访问数组元素的正确方法吗

我有两个数组。一个用于导航，另一个用于页面上的面板。两个数组的大小相同。一个面板一个导航按钮。这段代码可以工作，但我确信一定有更好的方法可以在不设置临时变量的情况下执行此操作。

$('.footer-nav li').click(function() 
{ 
  var temp = $('.footer-nav li').index(this); 
  var tArray = $('.about-bgs li'); 
  $('.about-bgs li').fadeOut(); 
  $(tArray[temp]).fadeIn();  //This is the line in question! 
}); 

有人接受吗？

请您参考如下方法:

对 $(selector).each(callback) 的 jQuery 回调 accepts two parameters :索引和元素。所以你可以写

$('.footer-nav li').each(function(index, element) { 
  element.click( function(evt) { 
    $('.about-bgs li').fadeOut(); 
    $('.about-bgs li').get(index).fadeIn(); 
  });  
}); 

但这对我来说似乎是一个奇怪的代码，因为列表中的所有元素(正在淡出)和指定元素(正在淡入)之间存在动画冲突。我认为它不会按预期工作。

由于似乎一次只有一个元素可见，因此我只会淡出当前可见的元素(并不是说您需要检查同一元素上是否有两次连续点击):

var current = $('.about-bgs li').fadeOut(); 
var last = $('.about-bgs li .current'); 
if (current !== last) { 
  last.removeClass('current').fadeOut(); 
  current.addClass('current').fadeIn(); 
} 

在 DOM 加载时，您必须指定一个 .current 元素并运行此函数(或相应地使用 CSS/JS)。