获取下一个元素在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的

回答

相关问题