Jquery Cycle 插件，内容更改时更新滑块，问题！

Question

我刚刚尝试了 Mike Alsup 的 Cycle 插件。对于我正在构建的页面来说，看起来足够简洁和简单。但现在，我遇到了一个问题。

我正在将 Cycle 应用于图像列表。现在，我尝试销毁并重新应用该插件，但没有成功。

当内容更改时，我触发 ('destroy'); 并再次应用插件：

$('#slides').cycle('destroy'); 

$('#slides').cycle({ 
    fx:     'fade', 
    speed:  'fast', 
    timeout: 0, 
    next:   '#next', 
    prev:   '#prev' 
});

这适用于：

<div id="display">

    <a href="#" id="prev">Previous</a>
    <a href="#" id="next">Next</a>  

    <div class="imgcontainer">
        <ul id="slides">
            > List of images to go into slideshow. <
        </ul>
    </div>

    <div class="infocontainer">
        <h2> Object title </h2>
        <p> Object information </p>
    </div>
</div>

一切看起来都很好，直到我在更新滑块后尝试更改图像：

类型错误：“null”不是对象（正在评估“p.cycleTimeout”）

整个 JavaScript；

$('#projects > li').click(function(){

        var a = $(this);

        $('#display .imgcontainer ul').html((a).children('ul.images').html());
        $('#display .infocontainer h2').html((a).children('h2').html());
        $('#display .infocontainer p').html((a).children('p').html());

        if(!$(a).hasClass('sub'))
        {
            var title = $(this).attr('title');
            $(a).siblings("[title='" + title + "']").toggle();
        }

        var imgcount = $('.imgcontainer li').size();


        // Only apply plugin if there's more than one image in the list.
        if(imgcount > 1)
        {
            $('#slides').cycle('destroy'); 

            $('#slides').cycle({ 
                fx:     'fade', 
                speed:  'fast', 
                timeout: 0, 
                next:   '#next', 
                prev:   '#prev' 
            }); 
        }
    });

Answer 1

第一次，即使从未应用过循环，您也会调用“销毁”。这可能就是你的错误的来源。

无论如何，你不应该这样做。 Cycle 有一个专门用于此目的的 addSlide 函数。请参阅示例：

• http://jquery.malsup.com/cycle/add.html?v2
• http://jquery.malsup.com/cycle/add2.html
• <一href="http://jquery.malsup.com/cycle/add3.html" rel="nofollow">http://jquery.malsup.com/cycle/add3.html