我想只有一個打開的面板（一種手風琴菜單）

我想只有一個打開的面板（一種手風琴菜單）。我想只有一個打開的面板（一種手風琴菜單）

我試了一下到目前爲止（在代碼中的註釋部分）：

//$('#tabs-1').show(100); 
//$('#tabs-2').hide(); 
//$('#tabs-3').hide();

如果標籤-1選擇if ($('#tabs-1').is(":visible"))然後隱藏tabs-2和tabs-3將被隱藏，tabs-1將被顯示，但如果我觸發，之後它不會作出反應，如果我例如點擊tabs-2，因爲tabs-1仍然打開('#tabs-1').is(":visible")（它被捕獲在這個塊）它不能被關閉。我知道，這可不行我改變現有的代碼，但我不認爲不同的解決方案的...

可能看看如何代碼看起來像：

function CloseTabInfo() { 
     $(".BWTabVerticalTitle").on("click", function() { 
      //alert("ausgeführt."); 
      var contentDiv = $(this).attr("data-forcolapse"); 
      $(contentDiv).toggle(900); 
      if ($('#tabs-1').is(":visible")) { 
       //[START] Close other tabs, only one has to be opend 
       //$('#tabs-1').show(100); 
       //$('#tabs-2').hide(); 
       //$('#tabs-3').hide(); 
       //[END] 
       if ($("input:checked").val() == 1) { 
        $('.BWShipmentType').text('@BWHtml.translate("Documents")'); 
       } 
       else if ($("input:checked").val() == 2) { 
        $('.BWShipmentType').text('@BWHtml.translate("Goods")'); 
       } 
       //$('.BWShipmentType').text($("input:checked").val()); 
       $('.BWTabVerticalPreferences').text($('#shippingDetails_preferences').val()); 
      } else if ($('#tabs-2').is(':visible')) { 
       //[START] Close other tabs, only one has to be opend 


       //$('#tabs-1').hide(); 
       //$('#tabs-3').hide(); 
       //$('#tabs-2').show(100); 
       //[END] 
       $('.BWSenderInfo').text($('#senderAddress_SenderAddress option:selected').text()); 
      } 
      else if ($('#tabs-3').is(':visible')) { 
       //[START] Close other tabs, only one has to be opend 

       //$('#tabs-1').hide(); 
       //$('#tabs-2').hide(); 
       //$('#tabs-3').show(100); 
       //[END] 
       $('.BWReceiverInfo').text($('#receiverAddress_matchCode').val()); 
       if ($('#shippingDetails_payment option:selected').text() != "Choose One") { 
        $('.BWPaymentInfo').text($('#shippingDetails_payment option:selected').text()); 
       } 
       $('.BWCostInfo').text($('#shippingDetails_CostList option:selected').text()); 

      } 
      else { 
       //$('.BWShipmentType').text(''); 
       //$('.BWTabVerticalPreferences').text(''); 
       //$('.senderAddressInfo').text(''); 
      } 
     });

我這對於jQuery來說是一種新鮮的東西，這讓我很難解決這個簡單的問題。

來源

2014-05-12 user254197

你應該用HTML小提琴以及使其更容易讓我們來幫助你。 ** [點擊這裏]（http://jsfiddle.net/）** –

您正在嘗試做什麼可以很容易地完成jQuery UI，jQuery的官方擴展，它增加了許多UI元素，如手風琴或選項卡。

jQuery UI Accordion

這裏是你如何可以輕鬆實現手風琴：

<script> 
    $(function() { 
    $("#accordion").accordion(); 
    }); 
</script> 
<div id="accordion"> 
    <h3>Section 1</h3> 
    <div> 
    <p>Content 1</p> 
    </div> 
    <h3>Section 2</h3> 
    <div> 
    <p>Content 2</p> 
    </div> 
    <h3>Section 3</h3> 
    <div> 
    <p>Content 3</p> 
    </div> 
</div>

來源

2014-05-12 18:05:55 Frithjof

我想只有一個打開的面板（一種手風琴菜單）

回答

相關問題