点击jQuery打开最近的ul

时间:2015-12-09 22:31:04

标签: jquery find html-lists next closest

点击a.market-metro时,打开最近的ul.children。

<ul class="drop-padding">
<li>
    <a class="market-metro">text</a>
    <ul class="children">...</ul>
</li>
<li>
    <a class="market-metro">text</a>
    <ul class="children">...</ul>
</li>
<li>
    <a class="market-metro">text</a>
    <ul class="children">...</ul>
</li>

我有以下但没有工作:

jQuery(".market-metro").click(function(){
    if (jQuery(".market-metro").closest('li').find('ul.children').hasClass("expanded")) {
        jQuery(".market-metro").closest('li').find('ul.children').removeClass("expanded").slideUp(250);
    } else {
        jQuery(".market-metro").closest('li').find('ul.children').addClass("expanded").slideDown(250);
    }
});

1 个答案:

答案 0 :(得分:1)

您需要使用$(this) ..并且您可以使用.next()代替closest and find并使用.not()

$(".market-metro").click(function(){
    $('ul.children').not( $(this).next('ul.children')).removeClass("expanded").slideUp();
    $(this).next('ul.children').toggleClass("expanded").slideToggle(250);
});

Working Demo

  

注意:请务必包含jquery