1

我目前在使用 jQuery 定位 DOM 中的下一个 div 时遇到了一些麻烦。我怀疑这可能是由于<div>我的目标被包含在<a>标签中。

我的目标是div class="div_name"在用户悬停在div class="island_hover"

HTML:

<div id="interactive_map">
<a href="#"><div class="island_hover" id="1"></div></a>
    <div class="div_name" id="id1"><p>id1</p></div>
<a href="#"><div class="island_hover" id="2"></div></a>
    <div class="div_name" id="id2"><p>id2</p></div>
<a href="#"><div class="island_hover" id="3"></div></a>
    <div class="div_name" id="id3"><p>id3</p></div>
<a href="#"><div class="island_hover" id="4"></div></a>
    <div class="div_name" id="id4"><p>id4</p></div>
<a href="#"><div class="island_hover" id="5"></div></a>
    <div class="div_name" id="id5"><p>id5</p></div>
<div id="interactive_map_close"></div>

jQuery:

$('.island_hover').hover(function() {
    $(this).next('.div_name').fadeToggle(600);
});

我一直在环顾四周并尝试了该方法.nextAll,但无济于事。我希望有人能够提供帮助。

4

1 回答 1

0

next()在当前节点的父节点周围寻找兄弟姐妹。

文档中:

获取匹配元素集中每个元素的紧随其后的兄弟。如果提供了选择器,则仅当它与该选择器匹配时,它才会检索下一个兄弟。

你需要做

$('.island_hover').hover(function() {
    $(this).parent().next('.div_name').fadeIn(600);
});
于 2013-06-02T14:08:19.217 回答