Question

我有一个视图是在“皇家滑块”幻灯片中，皇家滑块将div包裹在内部

<div id="myView" class="royalSlider rsDefault"></div>

这是我视图的根元素，我有一个附加到该根元素的项目列表。初始化$('.royalSlider').royalslider(function() {})时的皇家滑块将智能地包装每个元素并创建一个漂亮的幻灯片效果（我在x轴上使用它作为横向滚动而不是滑块）;

当我点击重新渲染视图时，我清空HTML然后添加新内容，如何重新初始化皇家滑块以再次智能地包装新元素？

这是否有意义，我可以为我的观点提供更多代码，但我真的不确定我需要在这里做些什么。

我不是100％确定如何重新渲染，但我将royalSlider作为一个函数

royalSliderReload = function() {
    var rsi = $('.royalSlider').royalSlider({
            keyboardNavEnabled: true,
            autoScaleSlider: true,
            autoScaleSliderWidth:  1400,
            autoScaleSliderHeight: 600,
            sliderDrag:  false,
            navigateByClick: false,
            addActiveClass:  true
    });
}

我尝试在视图中调用我的render方法中的royalSliderReload();然后没有用，所以我尝试初始化方法并没有成功。我还尝试在视图中创建它作为方法，然后重新渲染并调用this.royalSlider();

Answer 1

好吧，你没有提供很多关于插件的信息...无论如何，正如RoyalSlider的文档（http://dimsemenov.com/plugins/royal-slider/documentation/#api）中所述，如果修改DOM，你必须销毁你的RoyalSlider实例。：

var slider = $(".royalSlider").data('royalSlider');
slider.destroy();

然后您可以将新闻幻灯片添加到滑块

slider.appendSlide($(".element"));

如果只删除滑块内容而不是滑块本身，则此方法可能有效。

视图更改时骨干重新加载滑块？

1 个答案: