如何使用next()在jquery中找到最接近的ul?

nzkunb0c  于 2023-06-22  发布在  jQuery
关注(0)|答案(3)|浏览(140)

我有一个简单的菜单,类似这样:

<ul id="navigation">
    <li id="m_li">
         <div><span>+</span><a href="#" >myself</a></div>
        <ul class="test" id="x_ul">
            <li id="li">
                <a href="#" >Pictures</a>
            </li>
            <li id="li">
                <a href="#" >Audio</a>
            </li>
        </ul>
    </li>
    <li id="profile_modeling_li">
        <div><span>+</span><a href="#" >friend</a></div>
        <ul class="test" id="y_ul">
            <li id="li">
                <a href="#" >Pictures</a>
            </li>
            <li id="li">
                <a href="#" >Video</a>
            </li>
        </ul>
    </li>
</ul>

然后我使用jquery,所以当我点击+符号时,ul会向下滑动:

$("#navigation > li > div > span").click(function(){

    if(false == $(this).next('ul').is(':visible')) {
        $('#accordion ul').slideUp(300);
    }
    $(this).next('ul').slideToggle(300);
});

问题是$(this).next('ul')似乎不喜欢下一个用户界面
有什么想法我做错了什么吗?

fgw7neuy

fgw7neuy1#

使用

$(this).parent().next()

而不是

$(this).next();

当然,你可以传递一个选择器(更简单或更复杂),它将所需的元素标识为参数:

$(this).parent().next('ul.test[id$="_ul]"');
watbbzwu

watbbzwu2#

.next / .prev遍历同级节点,ul不是span的子节点。你应该找到最近的li,然后找到.test

$(this).closest('li').find('ul.test')
thtygnil

thtygnil3#

转换

$(this).next('ul')

$(this).parent().next('ul')

你可以在这里看到http://jsfiddle.net/PYqS2/

相关问题