展示和鏈接

，當點擊隱藏一些的div因此，情況是這樣的：展示和鏈接

我有幾個環節，每一個隱藏的div需要，當用戶點擊特定的鏈接顯示。當然，另一個鏈接中已經可見的div需要隱藏在同一個操作中。所有的div默認都是隱藏的。我在想最簡單的方法是將id激活分配給點擊鏈接的子div，然後顯示（）#active，然後在每次點擊另一個div時我會隱藏#active id，再將其分配給另一個div div然後顯示ID。這是可能的嗎？代碼是怎麼樣的？是的，我是一個Jquery的新手。該html代碼如下所示：

<div class="nav"> 
    <ul> 
     <li><a href="#" title="show phone #(403) 454-5526">Call us</a> 
      <div class="navLinks"> (403) 454-5526 </div> 
     </li> 
     <li><a href="#">Visit our website</a> 
       <div class="navLinks"> Content Here </div> 
     </li> 
     <li><a href="#"Email us</a> 
       <div class="navLinks"> Content Here </div> 
     </li> 
     <li><a href="#">Send to a friend</a> 
       <div class="navLinks"> Content Here </div> 
     </li> 
    </ul> 
</div>

來源

2012-06-26 viktor

這樣的事情呢？

$(".nav a").on("click", function(e) { 
    var div = $(this).siblings(".navLinks").toggle(); 
    $(".navLinks").not(div).hide(); 
    e.preventDefault(); 
});

DEMO：http://jsfiddle.net/4ncew/1/

來源

2012-06-26 18:15:22 VisioN

我都喜歡這個解決方案和阿迪爾的解決方案，但是我想我會用這一。謝謝。 – viktor

@viktor歡迎您！ – VisioN

試試這個，Demo

$('.nav li a').click(function(){  
    $('.navLinks').css('display', 'none'); 
    $(this).next().css('display', 'block'); 
});

來源

2012-06-26 18:16:21 Adil

這應該做你需要的東西：

$(document).ready(function(){ 
    $('.nav ul li a').click(function(){ 
     $('.navLinks').css('display','none'); 
     $(this).siblings('.navLinks').css('display','block'); 
    });  
});

這裏是一個的jsfiddle爲你測試一下：http://jsfiddle.net/2H4zD/3/

來源

2012-06-26 18:16:22 johnmadrak

謝謝你的幫助，但是這並不隱藏已經存在的元素。 – viktor

我在最後一次編輯中添加了，再次檢查。對不起，我錯過了那個細節。 – johnmadrak

我在這裏貼，自己嘗試：http://jsfiddle.net/Y97F8/

這裏是做它的代碼：

jQuery(function(){ 

    //hide all first 
    jQuery(".navLinks").hide(); //hide others 

    jQuery(".nav ul li a").each(function(i) { 
     jQuery(".nav ul li a").eq(i).click(function() { 
     jQuery(".navLinks").hide(); //hide others 
     jQuery(".nav ul li a").eq(i).next().show(); //show the div at the specified index 
     }); 
    }); 

});

來源

2012-06-26 18:21:41

回答

相關問題