顯示與在導航

索引我有這樣的設置數的div：顯示與在導航

Link   ------------------------------ 
Link   |       | 
Link   |       | 
Link   |   DIV    | 
       |       | 
       |       | 
       ------------------------------ 

       (3 more divs are hidden)

鏈接的數量會有所不同，但對於每一個環節也將有一個內容股利。

到目前爲止，我已經使用這個代碼，它的工作原理：

$(".link").click(function() { 
var divname = this.name; 
$("."+divname).fadeIn('slow').siblings().hide();

不過是用戶生成的這個時間，因爲內容我都在給定的名字沒有控制權。

是否有可能用jQuery來計算鏈接的數量和盒子的數量（它總是相等的），假設我點擊第二個鏈接，第二個div將顯示。如果我點擊第三個鏈接，第三個div將顯示等等。

這是HTML：

<div id="links"> 
<span>Link</span> 
<span>Link</span> 
<span>Link</span> 
<span>Link</span> 
</div> 

<div id="content"> 
<div>DIV 1</div> 
<div>DIV 2</div> 
<div>DIV 3</div> 
<div>DIV 4</div> 
</div>

這是我的嘗試：

$(".div").not(":first").hide(); 

$(".link").click(function() { 

    var number = $("#links").index(this); 

});

沒有相當多呢。但我現在怎麼能告訴內容，它應該顯示鏈接中點擊索引編號的div？

來源

2012-02-08 Melros

我想嘗試這樣的事：

$(".div").not(":first").hide(); 

$("#links span").click(function() { 
    $('#content div').eq($(this).index()).show().siblings().hide(); 
});

來源

2012-02-08 05:25:21 Blender

感謝您非常大量的這種快速和工作答案！此外，我也學會了如何正確使用eq，這對未來非常有用，謝謝！ – Melros 2012-02-08 05:40:13

jQuery的循環包括計數器：

$("#links span").each(function(i) {  
    $(this).click(function(){$("#content div").eq(i).fadeIn("slow").siblings().hide();}); 
});

的小提琴是在這裏：http://jsfiddle.net/Rmr8R/

來源

2012-02-08 05:33:34 Christophe

顯示與在導航

回答

相關問題