1

我有以下html：-

<ul class="nav-list">
    <li><a style="cursor:pointer;"><span class="hello"> ></span>OVERVIEW</a> 
        <ul here>
            <li id="Overview"><a href="/en/overview">OVERVIEW</a>


        </ul>
    </li>
</ul>

我希望，当单击 span class hello 时，此处的 ul 将添加一个类，我尝试了以下操作：-

<script>
$(function(){
    $('.hello').click(function(){
        $(this).siblings().find('ul').addClass('hello');
    })  
})
</script>

在这种情况下，我该如何处理 sublings、父母和孩子并找到 ('ul')？

4

7 回答 7

3 
<script>
$(function(){
    $('.hello').click(function(){
        $(this).closest("li").find('ul').addClass('hello');
    })  
})
</script>

参考最近，找到

于 2013-09-13T07:18:47.683 回答
1

ul是父li元素的下一个兄弟

$(function(){
    $('.hello').click(function(){
        $(this).parent().next().addClass('hello');
    })  
})

演示：小提琴

于 2013-09-13T07:18:36.267 回答
1 
<script>
$(function(){
    $('.hello').click(function(){
        $(this).parent().siblings().find('ul').addClass('hello');
    })  
})
</script>

span 没有任何同级 ul，其父级有

于 2013-09-13T07:19:09.787 回答
1

你可以通过两种方式做到这一点：

1：使用 .closest() 向上遍历并使用 .find()

$('.hello').click(function(){
    $(this).closest('li').find('ul').addClass('hello');
})

2：使用 .parent() 获取 1 级的元素并使用 .siblings()

$('.hello').click(function(){
    $(this).parent().siblings('ul').addClass('hello');
})
于 2013-09-13T07:20:49.347 回答
0 
 $('.hello').click(function(){
        $(this).closest("li").find('ul').addClass('hello');
  })
于 2013-09-13T07:19:39.233 回答
0

根据http://api.jquery.com/find/

你不需要siblings()打电话

$(this).find('ul').addClass('hello');

会没事的

于 2013-09-13T07:20:40.980 回答
0

一种简单的方法是在点击监听器中：

$(this).closest("li").find("ul").addClass("hello");

最接近你有 li 容器，然后你可以在容器中找到正确的兄弟 ul 。

我使用这个解决方案而不是 .parent() 因为它不依赖于元素在 DOM 中的位置，并且如果您出于任何原因将跨度或锚点包装在另一个标签中，它仍然可以工作。

于 2013-09-13T07:21:08.380 回答