Question

我在我的webapp中使用了jquery循环插件和backbone.js。我正在我的一个Backbone视图中启动寻呼机。这就是我现在正在做的事情......

var SlideView = Backbone.View.extend({
    template: _.template($('#SlideViewTemplate').html()),
    initialize: function() {
        _.bindAll(this, 'render');
        this.render();
    },
    render: function() {
        return $(this.el).html(this.template(this.model.toJSON()));
    }
});

var SlideListView = Backbone.View.extend({
    el: $('#SlideNavi'),

    initialize: function() {
        _.bindAll(this, 'render', 'populate');
        this.render();
    },
    render: function() {
        _(this.collection.models).each(function(item) {
            this.populate(item);
        }, this);

        $('#Slideshow').cycle({
            fx: 'fade',
            pager: '#SlideNavi'
        });
    },
    populateChildren: function(slide) {
        var itemView = new SlideView({
            model: slide
        });
        $(this.el).append(itemView.render());
    }
});
new SlideListView({collection: someCollection});

这是我的视图模板，没什么特别的：

<script type="text/template" id="SlideViewTemplate">
    <%= name %>
</script>

以下是填充后视图的外观：

<div class="SlideNavi">
    <div>Service1</div>
    <div>Service2</div>
    <div>Service3</div>
    <div>Service4</div>
</div>

现在，el中使用的SlideListView在加载页面时为空。但是在填充了视图之后，我调用了jquery循环插件来开始幻灯片放映。问题是幻灯片正在运行，但寻呼机却没有。没有activeClass被添加到寻呼机元素，如in this demo ....

所示

我在这里错过了什么？

Answer 1

我找到了here的答案。请务必加入jquery.cycle.all.js，而不是jquery.cycle.lite.js。

jquery循环插件：寻呼机无法正常工作

1 个答案: