獲取下一個元素在jQuery的

我有類似這樣的標記：獲取下一個元素在jQuery的

<div> 
    <a href="#">show</a> 
</div> 
<div class="msg" style="display: none;">message</div> 

<div> 
    <a href="#">show</a> 
</div> 
<div class="msg" style="display: none;">message</div> 

<div> 
    <a href="#">show</a> 
</div> 
<div class="msg" style="display: none;">message</div>

我想說明的「味精」點擊父鏈接時。

這是我有：

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

    $(this).next('.msg').show(); 

});

但是這不工作，沒有做任何事情。有什麼建議麼？

謝謝！

編輯：

這是確切的標記：

<div class="left"> 
    <a href="/checkout/" class="overlay_box no_thanks">&#171; Back</a> 
</div> 
<div class="right"> 
    <button type="submit" class="button link" href="'.$item->click_url.'"> 
    <span>'.$this->lang->line('next').'</span></button> 
</div> 
<div class="clear"></div> 
<br/> 
<div class="message" style="display: none;"> 
    <img src="/assets/img/icon.png" class="left"/> 
    <p class="left"><b>Complete?</b> Once you have completed (<a href="/help">Help</a>)</p> 
    <div class="clear"></div>

的點擊事件上的按鈕。

來源

2011-06-14 dzm

$(this).parent().nextAll('.message:first').show();

由於鏈接是div內唯一的元素，因此它沒有兄弟，所以next（）爲它返回一個空集。您需要獲取父元素併爲其調用next（）。

來源

2011-06-14 14:50:05

打我吧：P – silent1mezzo 2011-06-14 14:50:45

嗯..不工作爲了我。請參閱上面的編輯 – dzm 2011-06-14 14:53:55

，這是因爲您的真實標記中沒有msg類。 – 2011-06-14 14:57:46

它不會工作，因爲<a>元素不是'.msg'元素的父親 - 它實際上是它的兄弟姐妹的孩子。

來源

2011-06-14 14:50:23

首先，定位<a>的父項，如下所示：$('a').closest('div').next('.msg').show()。如果僅顯示元素，而您又不想導航到其他頁面，則可以通過添加.preventDefault()或return false來防止<a>標籤的自然行爲。他們都工作。就像這樣：

$('a').click(function(e){ 
    $(this).closest('div').next('.msg').show(); 

    e.preventDefault(); 
});

你也可以使用：

$('a').parent().next()...

但很顯然，下面的是更高效：

$('a').closest(tag).next()...

來源

2011-06-14 15:14:08 Shaoz

獲取下一個元素在jQuery的

回答

相關問題