ShowHide（shID）一次只顯示一個div？

Question

我目前正在Bootstrap網站上工作。我是jquery和Java新手，所以我不知道如何做到這一點。

我有這樣的事情：http://jsfiddle.net/PVLMX/2/

function showHide(shID) { 
if (document.getElementById(shID)) { 
    if (document.getElementById(shID+'-show').style.display != 'none') { 
    document.getElementById(shID+'-show').style.display = 'none'; 
    document.getElementById(shID).style.display = 'block'; 
    } 
    else { 
    document.getElementById(shID+'-show').style.display = 'inline'; 
    document.getElementById(shID).style.display = 'none'; 
    } 
} 
} 

我使用的顯示圖片庫菜單上的顯示隱藏的功能。我希望能夠一次顯示一個div。在這個例子中，當你按下第二個查看更多按鈕時，隱藏第一個內容（看更多），而不必點擊「隱藏這個內容」。我想消除「隱藏此內容」按鈕。

這有道理嗎？對不起，如果我不清楚，並感謝您的幫助！

Answer 1

改變一點點你的HTML和添加JQuery的，你可以用這種方式實現它：

HTML

<div id="wrap"> 
    <p>This text is visible, but there is more. 
    <a href="#" id="example-show" class="showLink"> 
     <br/> 
     <br/>See more >></a> 
    </p> 
    <div id="example" class="more"> 
    <p>This text was hidden, now you see it</p> 

    </div> 
</div> 
<div id="wrap"> 
    <p>This text is visible, but there is more. 
    <a href="#" id="example2-show" class="showLink"> 
     <br/> 
     <br/>See more >></a> 
    </p> 
    <div id="example2" class="more"> 
    <p>This text was hidden, now you see it</p> 
    </div> 
</div> 

JQUERY

$('.showLink').click(function() { 

    $('.showLink').parent().next().hide(); 
    $(this).parent().next().show(); 

}) 

記住要添加的JQuery在HTML頭部

她E公司的一個的jsfiddle：http://jsfiddle.net/PVLMX/13/

如果您想了解更多一些關於Jquery的parent()和next()：

https://api.jquery.com/parent/

https://api.jquery.com/next/