Question

我正在使用jCarousel（http://sorgalla.com/projects/jcarousel/）进行图片预览，但面临一个问题：我不知道如何重新加载/刷新jCarousel动态列表。

我的图像类别很少。当我点击其中一张图片时，我需要创建列表并从该元素开始预览。我有一些代码，但不知道如何在点击预览以其他图像开始的其他图像后重新创建所有列表。这是我的代码：

$(document).ready(function(){
$("ul#stage li").live('click', function() {

    var ul = $(this).parent();
    var index = +(ul.children().index(this))+1;

    var mycarousel_itemList = [ ];

    $('li[data-id]').each(function () {
        var $this = $(this);
            mycarousel_itemList.push({
                url : $this.attr("data-img"),
                title : $this.attr("data-title")
            });
    });

    function mycarousel_itemLoadCallback(carousel, state) {
        for (var i = carousel.first; i <= carousel.last; i++) {
            if (carousel.has(i)) {
                continue;
            }
            if (i > mycarousel_itemList.length) {
                break;
            }
            carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[i-1]));
        }
    };

    function mycarousel_getItemHTML(item) {
        return '<img src="' + item.url + '" width="800" height="600" alt="' + item.url + '" />';
    };
        alert(index);
    jQuery('#mycarousel').jcarousel({
        itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback},
        size: mycarousel_itemList.length,
        scroll: 1,
        start: index,
        wrap: 'last',
        animation: 'fast',
        visible: 1
    });

    document.getElementById('popup-content').style.background='url('+$(this).attr("data-img")+') no-repeat center';
    document.getElementById('fades').style.display='block';
    document.getElementById("light").style.display = "block";
    $("#light").fadeTo("slow", 1);
});
});

一切都是这样的：有图像＆gt;我点击其中一个＆gt;弹出窗口显示jCarousel和一个可见图像，然后我可以滚动浏览所有其他图像。

它运作良好，但只是第一次。当我点击其他图像时（关闭弹出窗口后），视图以最后打开的图像开始。

如果事情不够清楚 - 请问。我会尽力做到更准确。谢谢你的帮助！

Answer 1

你可以重新创建jCarousel，首先使用$（'＃mycarousel'）。remove（）;然后再次初始化jCarousel。我真的不明白你要做什么，但这在大多数情况下都有帮助，当然jCarousel应该有Destroy方法，但它没有。

为什么在某些情况下你不使用jquery选择器呢？

每次点击图像时jCarousel初始化/刷新/重新加载

1 个答案: