如何解决在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>
我想在单击父链接时显示\'msg \'。
这是我所拥有的:
$(\'a\').click(function(){
$(this).next(\'.msg\').show();
});
但是,这行不通,什么也不做。有什么建议么?
谢谢!
编辑:
这是确切的标记:
<div class=\"left\">
<a href=\"/checkout/\" class=\"overlay_Box no_thanks\">« 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>
点击事件在按钮上。
解决方法
$(this).parent().nextAll(\'.message:first\').show();
由于链接是div中的唯一元素,因此它没有兄弟姐妹,因此next()为其返回一个空集。您需要获取父元素并为其调用next()。
, 它不会起作用,因为<a>
元素不是the5ѭ元素的父级-实际上是其同级的子级。
, 首先,针对<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()...
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。