javascript - 自定义 jCarousel 触发器 - 项目结束

标签 javascript jquery jcarousel jcarousellite

我正在使用 jCarousel 来显示项目列表。假设有 8 项。我显示 4,等待 10 秒,然后滚动显示最后 4 个。我希望它显示前 4 个,然后抛出一个触发器,告诉它重新绑定(bind)数据。这些项目将更新并继续像这样循环。

这些项目正在通过 jquery.load [ajax] 加载。我希望这些项目在全部显示后重新绑定(bind)。如果我能在骑行两次后让它们重新绑定(bind)就更好了。我使用 setInterval (基于时间)重新绑定(bind)数据,但我希望它是动态的,这样我就不必在添加更多项目时更改 JavaScript 计时器。

我的调用代码如下所示:

    $(document).ready(function () {
        updateConsoles();


        $("#tableapp").ajaxStop(function () {                
            scrollwindow();
        });
    });      

    function updateConsoles() {
        $('#tableapp').load('AjaxPages/ApplicationMonitor.aspx #application');
    }        
    function scrollwindow() {
        $("#tableapp").jCarouselLite({
            vertical: true,
            hoverPause: true,
            visible: 4,
            auto: 6000,
            speed: 500,
            scroll: 4
        });
    };

理想情况下,我希望能够添加以下内容:

   function scrollwindow() {
        $("#tableapp").jCarouselLite({
            vertical: true,
            hoverPause: true,
            visible: 4,
            auto: 6000,
            speed: 500,
            scroll: 4,
            whenFinishedCyclingItems: updateConsoles()
        });
    };

我对 javascript 和 jQuery 还很陌生。

最佳答案

看起来像jCarouselLite有一个 afterEnd 函数。

所以你应该能够做这样的事情:

function scrollwindow() {
        $("#tableapp").jCarouselLite({
            vertical: true,
            hoverPause: true,
            visible: 4,
            auto: 6000,
            speed: 500,
            scroll: 4,
            afterEnd: updateConsoles()
        });
    };

我不确定是否必须将该函数包装在另一个函数中,但以防万一,代码如下:

afterEnd: function(){updateConsoles();}

关于javascript - 自定义 jCarousel 触发器 - 项目结束,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8671155/

相关文章:

javascript - SVG 图像格式

javascript - 未捕获的 TypeError : a. indexOf 不是函数 [PRELOADER]

jquery - Jcarousel无限循环

javascript - jCarousel 没有在隐藏的 div 中绘制

jquery - 如何控制JCarousel垂直滚动条的速度?

javascript - 如何使用 Jest 在 typescript 中模拟 Date 对象?

javascript - React 类不渲染

javascript - 按商索引数组

javascript - 背景图像交换动画

javascript - WP 媒体库 - 选择函数不更新 ID 更新的行索引