這是在jQuery中訪問數組元素的正確方法嗎？

Question

我有兩個數組。一個用於導航，另一個用於頁面上的面板。這些陣列的大小相同。一個面板的一個導航按鈕。這段代碼可以工作，但是我確信在沒有設置臨時變量的情況下，必須有更好的方法來做到這一點。

$('.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! 
}); 

任何接受者？

Answer 1

jQuery回調到$(selector).each(callback)accepts two parameters：index和element。所以，你可以寫

$('.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進行播放）。

Answer 2

我想你應該已經能夠只使用tArray[$(this)].fadeIn()

編輯：一些其他的東西：正如你已經寫var tArray = $('.about-bgs li');，你可以只使用tArray.fadeOut();