代码之家 › 专栏 › 技术社区 › Cameron

基于类别的wordpress jquery切换

wordpress jquery

Cameron · 技术社区 · 15 年前

我有以下导航:

<li id="categories">
    <ul>
        <li class="cat-item cat-item-8 current-cat"><a href="#">Link</a>
            <ul>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a></li>
            </ul>
        </li>
        <li class="cat-item cat-item-10"><a href="#">Link</a>
            <ul>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a></li>
                <li class="cat-item"><a href="#">Link</a>
                    <ul>
                        <li class="cat-item"><a href="#">Link</a></li>
                        <li class="cat-item"><a href="#">Link</a></li>
                        <li class="cat-item"><a href="#">Link</a></li>
                        <li class="cat-item"><a href="#">Link</a></li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</li>

以及以下JS:

jQuery("#categories li.cat-item").each(function(){
    var item = jQuery("<span>").addClass('plus'),
        that = jQuery(this);

    if ( that.has("ul").length ) {   
        item.click(function(e){
            var self = jQuery(this);
            self.text( self.text() === "+" ? "-" : "+" )
                .parent().next().toggle();
            e.preventDefault();
        }).text('+');

        that.find(".children").hide();
    }

    that.children("a").prepend( item );
});

这为我的分类建立了一个很好的切换菜单。

但是,我希望它做的是基于我当前查看的类别,显示用户登录页面时要打开的相应菜单。 这需要同时适用于职位和类别。

谢谢。

2 回复 | 直到 15 年前

Felix Kling 15 年前

把这个放在你的代码之后:

jQuery('#categories .current-cat span.plus:first').click();

模拟第一次点击 plus 登录当前类别。

如果您想扩展整个树,只需省略 :first :

jQuery('#categories .current-cat span.plus').click();

顺便说一句,菜单没有在我尝试时崩溃,我不得不将您的代码改为 that.children("ul").hide();

更新:

如果 .current-cat 在A上 li 元素在子树中,可以执行以下操作:

jQuery('#categories .current-cat').parents('li:not(#categories)')
                                  .andSelf()
                                  .find('span.plus:first').click();

这会找到每个家长 锂 ,包括当前 锂 ( andSelf() ,以防它再次是子树的根)并单击第一个 + 在每一个上面签名。