jQuery的最接近不想工作

我已經反覆向下頁的圖像，像這樣旁邊一個div：jQuery的最接近不想工作

vuQuestionBubble有一個風格顯示：默認爲無。點擊「prodQuestionMark」後，我想要顯示旁邊的vuQuestionBubble。將此代碼放在底部。

$(document).ready(function() { 
    $('.prodQuestionMark').click(function() { 

     $(this).closest('vuQuestionBubble').show(); 
    }); 
});

它似乎並沒有工作...點擊事件是工作，我可以選擇具有.parent父格，但不能似乎與最近的div互動...任何想法？

來源

2011-03-07 phili

closest查找祖先，沒有兄弟姐妹;另外，您的選擇器在開始時缺少一個.（您正在告訴它尋找vuQuestionBubble元素，其中您確實是指類別爲「vuQuestionBubble」的div）。

使用您當前的結構，您可以使用next，因爲具有「vuQuestionBubble」的div是下一個元素。但是，如果您改變結構並在它們之間放置東西，next將不適合您。

我可能會使用nextAll("div.vuQuestionBubble:first")或nextAll(".vuQuestionBubble:first")（鏈接：nextAll，:first）：

$(document).ready(function() { 
    $('.prodQuestionMark').click(function() { 

     $(this).nextAll('div.vuQuestionBubble:first').show(); 
     // Or without `div`: 
     //$(this).nextAll('.vuQuestionBubble:first').show(); 
    }); 
});

這將發現與類下面的img作爲同級「vuQuestionBubble」第一個div，即使它是而不是img旁邊的右邊，因此如果標記略有變化，您的代碼就不易受維護問題的影響。

來源

2011-03-07 12:04:46

感謝這樣一個深入的答案。我不知道這些功能。 – phili 2011-03-09 08:37:11

@phili：不用擔心，很高興幫助。 – 2011-03-09 08:38:13

closest函數找到最接近元素的祖先。您實際上需要使用.next('.vuQuestionBubble')。

來源

2011-03-07 12:00:38

你仍然需要類選擇器（。） – kapa 2011-03-07 12:06:42

@bazmegakapa，謝謝。我已經添加了類選擇器。 – 2011-03-07 14:04:58

說明：獲取選擇匹配的第一個祖先元素，在當前元素和通過DOM樹

翻譯前進了開始：最近明顯得到祖先，沒有兄弟姐妹。

裁判：http://api.jquery.com/closest/

有一個突破，有一個包，吉。

來源

2011-03-07 12:01:50

是的，但不知何故......不完整。 ;-) – 2011-03-07 12:14:34

我認爲我的最新更新已經把這個權利：P – 2011-03-07 17:00:49

vuQuestionBubble是一類

$(this).closest('vuQuestionBubble').show(); 
=> 
$(this).closest('.vuQuestionBubble').show();

來源

2011-03-07 12:02:41 Bogdan

然而，因爲它不是一個祖先... – 2011-03-07 12:10:14

closest橫穿至祖先元素，所以儘量siblings('vuQuestionBubble')

來源

2011-03-07 12:03:42 Prakash

jQuery的最接近不想工作

回答

相關問題