jquery兄弟選擇器在不同的div

我是新來的jquery，並試圖使此代碼的工作，用戶幫助過我，但我現在有麻煩。jquery兄弟選擇器在不同的div

我想讓我的攝影網站在頂部有按鈕，當你點擊一個按鈕時，你點擊的類別（即'風景''肖像''婚禮'）顯示所有帖子與這些「標籤「（div類）。我讓它在小提琴中工作，但是當我嘗試在帖子周圍包裝div以及將它們放在頁面上時，兄弟選擇器會中斷。

舊的工作小提琴這裏（不派息包裝）：http://jsfiddle.net/PxpXy/

破碎的小提琴這裏（DIV的包裝）：http://jsfiddle.net/JUsZK/10/

我已經加入包裝到兩個頂部的按鈕和上下文（#test &＃test2）但現在（顯然）兄弟姐妹選擇器不起作用。

如何仍然可以使用我的網站功能並使用div包裝將它們重新放置在頁面上？我會不再需要兄弟選擇器嗎？

謝謝！

來源

2012-08-05 user1340081

請考慮在您的問題中發佈這兩個代碼片段的相關部分（或代碼的單個版本，並帶有修訂標記的註釋）。小提琴是一個好主意，但Stack Overflow的目標是自成體系，如果（'$ DEITY'禁止）jsfiddle在線下的某處下線，你的問題將被遺留下來，並且對未來的訪問者沒有多大用處。 – 2012-08-05 14:35:00

在HTML中，id應該是唯一的。在第二個（非工作）小提琴中，您有三個ID爲test的div。

來源

2012-08-05 14:32:51 SomeKittens

這在一般意義上可能是正確的，但這不是爲什麼jQuery代碼不能在第二個小提琴中工作。 – nnnnnn 2012-08-05 14:41:40

你的div不sibblings anylonger，一個固定的版本可能是http://jsfiddle.net/JUsZK/11/

來源

2012-08-05 14:34:54

謝謝。我也喜歡這個修復！ – user1340081 2012-08-05 15:15:37

鑑於你已經包裹在一個div圖片ID爲「測試」，你可以這樣做：

$('#test .post').hide();

也就是說，隱藏在'#test'div內的class'.post'的元素。

演示：http://jsfiddle.net/nnnnnn/JUsZK/12/

來源

2012-08-05 14:34:57 nnnnnn

謝謝！那個石頭。超級方便 – user1340081 2012-08-05 15:12:56

你必須只需你選擇修改於：

$('button').click(function() { 
    $('div.post').hide() 
    $('.' + this.id).show(500); 
});

JS Fiddle demo。

使用$('div.post')意志，當然，工作在所有div元素與post的class。要限制爲僅某些div小號的反應，你可以指定一個父容器元素，然後用find()只有在你特別感興趣的那些元素的工作，例如：

$('button').click(function() { 
    $(parentElementSelector).find('.post').hide() 
    $('.' + this.id).show(500); 
});

注意，我還沒有糾正多個id問題，但我建議使用class（或者，因爲你沒有在jQuery中使用它，我可以在你的問題中看到看到，只需刪除id）。

來源

2012-08-05 14:39:02

謝謝你。我會看看你的建議！ – user1340081 2012-08-05 15:15:17

jquery兄弟選擇器在不同的div

回答

相關問題