jquery – 使用Bootstrap轮播仅在每张幻灯片上显示8个项目

我正在生成一个不确定数字对象的数组(因为数组是动态创建的,基于管理界面和他们输入了多少个对象.)我正在尝试使用Bootstrap轮播在每张幻灯片上只显示8个对象,如果有超过8个,将附加内容移动到下一个幻灯片直到16,然后下一个幻灯片上移到24,依此类推.如果用户向前或向后点击(我不会自动浏览幻灯片),我也希望它能够运行.

以下是我正在运行的代码,包括变量idx,它是数组中的顺序对象编号(基于零).

HTML

JavaScript的：

    $(document).ready(function(){
        <% JSONObject jsonObject=(JSONObject)session.getAttribute("responseDetailsJson"); %>
        var tileSetobjects = <%=jsonObject%>
            $.each(tileSetobjects.HelpJSONArray,function(idx,obj){
                $('#articles').append('

感谢您的帮助！

最佳答案

你说你正在使用Bootstrap,但你的标记根本没有反映出来.

我将从Bootstrap JavaScript Documentation开始,其中包括有关Carousel的详细部分.

如上所述,将interval选项设置为’false’以禁用自动滚动,这将实现您所需的行为.如文档中所述：

The amount of time to delay between automatically cycling an item. If false,carousel will not automatically cycle.

关于8个,你的JavaScript看起来应该可以工作,虽然需要修改标记注入部分以匹配Bootstrap轮播标记(参见上面的链接).