0

基本上我试图找到下一个'sacc-trigger',但'next()'不起作用,因为它嵌套在一个列表中;我尝试了许多变体,例如 parent().next() 但我无法让它工作。

也许如果有人能给我指个方向;会好的。

我有以下 HTML 代码:

<ul class="taxo2">
    <li class="">
        <div class="sacc-trigger active" style="width: 0px;">
            Photos
        </div>
        <div class="sacc-container" style="display: block; width: 0px;">
        </div>
    </li>
    <li class="">
        <div class="sacc-trigger" style="width: 0px;">
            Statements
        </div>
        <div class="sacc-container" style="display: none; width: 0px;">
        </div>
    </li>
    <li class="">
        <div class="sacc-trigger" style="width: 0px;">
            Powerpoint Presentations
        </div>
        <div class="sacc-container" style="display: none; width: 0px;">
        </div>
    </li>
    <li class="">
        <div class="sacc-trigger" style="width: 0px;">
            Videos/Interviews
        </div>
        <div class="sacc-container" style="display: none; width: 0px;">
        </div>
    </li>
</ul>

并尝试使其与 jQuery Accordion 一起使用;有以下我正在尝试调整的来源:

(function() {

            var $container = $('.sacc-container'), $trigger = $('.sacc-trigger');

            $container.hide();
            $trigger.first().addClass('active').next().show();

            var fullWidth = $container.outerWidth(true);
            $trigger.css('width', fullWidth);
            $container.css('width', fullWidth);

            $trigger.on('click', function(e) {

                if ($(this).next().is(':hidden')) {
                    alert('here2');
                    $trigger.removeClass('active').next().slideUp(300);
                    $(this).toggleClass('active').next().slideDown(300);
                }
                e.preventDefault();
            });

            // Resize
            $(window).on('resize', function() {
                fullWidth = $container.outerWidth(true)
                $trigger.css('width', $trigger.parent().width());
                $container.css('width', $container.parent().width());
            });

        })();
4

1 回答 1

1

你想用jQuery的parent()来获取父级li,然后用.next找到下面的li。从这里您可以使用.find()获取触发器:

if ($(this).parent("li").next().find(".sacc-trigger").is(':hidden')) {
    $trigger.removeClass('active').next().slideUp(300);
    $(this).toggleClass('active').next().slideDown(300);
}

The reason behind this is because .sacc-trigger has no direct siblings, so you need to first find the closest parent, and then go down one level using next() as explained above.

于 2013-04-16T14:25:13.157 回答