jQuery在點擊時顯示div，隱藏其他

我想在我的頁面上有一個顯示div並隱藏其他div的文本區域（比方說8個其他div）。在點擊時，我想選擇的div顯示和當前div div其他div隱藏。有沒有簡單的解決方案？可能建立：show current clicked div hide previous clicked div？jQuery在點擊時顯示div，隱藏其他

來源

2010-08-16 ShawnB

我的東西離開了非同級切換divsjsFiddle example。 – ShawnB 2010-08-16 17:27:02

我在我的解決方案中使用了'input'按鈕來切換'divs'，這是你的意思嗎？ – 2010-08-16 18:10:55

下面是一個簡單的解決方案，利用鏈接在一起的方法。

$("input").click(function() 
{ 
    $("#" + $(this).attr("class")).show().siblings('div').hide(); 
});

（使用$（「輸入」））
jsFiddle example（使用$（「的className」））

該活化按鈕可以具有相同的class爲一體的idjsFiddle example受影響的div，或者你可以使用一個單獨的「toggler」類。

重要的部分是使用clicked元素的獨特功能映射到切換元素的獨特功能。

最後，如果切換divs不是兄弟，您可以使用var divs = $("#blah1, #blah2, #blah3, ...");設置所有人的選擇器，並使用.not()切換它們。我想這些div顯示/隱藏在頁面的不同區域被點擊（李一） -

的使用.not()

來源

2010-08-16 17:42:37

這工作得很好 - 我使用了.not（）示例，並將img用作我的選擇器，因爲我的a.class正在用於其他事件。謝謝！ – ShawnB 2010-08-17 13:46:38

@ShawnB - 很高興聽到。不要忘記接受解決問題的答案（選票下面的選項標記），並投票回答您認爲有用的答案。 – 2010-08-17 21:48:15

這樣的事情呢？

$(document).ready(function(){ 
    $('div.some_class').click(function(){ // set of divs to be clickable 
    $(this).siblings('div').hide(); // it's already showing, right? 
    }); 
});

當然，一旦一個被點擊，其餘是隱藏的，你有沒有辦法把他們回來的......

來源

2010-08-16 16:04:38

這取決於DOM結構。我會親自給他們上課，讓他們可以輕鬆訪問整個團隊。 $('.div-group').hide(0, function(){$('#my-div').show();});

考慮使用jQuery UI Accordion，它可能是您需要的功能的答案。

來源

2010-08-16 16:07:09 migajek

jQuery在點擊時顯示div，隱藏其他

回答

相關問題