2

嗨，我有一个产品列表，其中产品信息被隐藏，并且我使用 jquery 在单击时向下滑动信息。问题是我想要上一个。当用户点击另一个产品时向上滑动的信息。

我让它关闭前一个，但它不打开下一个。

这是用户将单击以获取更多信息的链接。

    <div class="list-op" target="<?php echo $i ?>" style="display:inline;"></div>

这是隐藏的div

    <div id="div<?php echo $i ?>" class="targetDiv" style="display:none">
                <div class="list-image">
                    <a  href="<?php echo $_product->getProductUrl() ?>" class="product-image" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>">
                        <img class="tTip" src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(140, 183); ?>" width="140" height="183" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>">
                    </a>
                </div>
    </div>

这是我的事件的jQuery代码

    jQuery(function ($) {
$('.list-op').click(function () {
    var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

    //Show the element if nothing is shown.
    if ($('.aktiv').length === 0) {
        $(itemid).slideToggle("slow");
        $(itemid).addClass('aktiv');

        //Hide the element if it is shown.
    } else if (itemid == "#" + $('.aktiv').attr('id')) {
        $('.aktiv').slideToggle("slow");
        $(itemid).removeClass('aktiv');

        //Otherwise, switch out the current element for the next one sequentially.
    } else {
        $('.aktiv').slideToggle(function () {
            $(this).removeClass('aktiv');
            if ($(".targetDiv:animated").length === 0) {
                $(itemid).slideToggle("slow");
                $(itemid).addClass('aktiv');
            }
        });
    }
});

});

4

1 回答 1

1

尝试将您的 jquery 更改为：

jQuery(function ($) {
    $('.list-op').click(function () {
        var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

        // this is already shown
        var stop = $(itemid).hasClass('aktiv')

        $('.aktiv').slideToggle("slow").removeClass('aktiv');

        if(stop) return;

        $(itemid).slideToggle("slow").addClass('aktiv');        
    })
});
于 2013-06-28T07:37:22.423 回答