Question

我一直在尝试对从我网站上的目录中提取的图片列表进行分页。我成功地在div分页中的“一，二，三......十六”文本中取得了成功。然而，所有图像（大约50个）都同时加载并跳过分页。

这是我的Scripts的加载订单还是我需要重新考虑如何从其他目录中提取图像？

我正在使用这个Pagination插件 - http://th3silverlining.com/2010/04/15/pajination-a-jquery-pagination-plugin/

JQUERY SCRIPTS

<script>
$(document).ready(function() {
    $('.fancybox').fancybox();
    $.ajax({
        url: "user-uploads-thumbnails",
        success: function(data){
            var imageNames = [];
            $(data).find("a:contains(.jpg)").each(function(){
                // store each image name into array
                imageNames.push($(this).attr("href"));
               });

            var sortedImageNames = imageNames.sort();

            for(var i = sortedImageNames.length; i-- > 0;) {
                    var linkImage = 'user-uploads/' + sortedImageNames[i];
                    var thumbnailImage = 'user-uploads-thumbnails/' + sortedImageNames[i];
                    var item = '<li><a class="fancybox" href="' 
                        + linkImage 
                        + '" data-fancybox-group="gallery"><img class=dropshadow src="' 
                        + thumbnailImage 
                        + '"></a></li>';
                    $(item).appendTo('.alt_content');
                }
            $('.fancybox').fancybox();
            }
        });
    });
    $('#paging_container3').pajinate({
                    items_per_page : 5,
                    item_container_id : '.alt_content',
                    nav_panel_id : '.alt_page_navigation'   
                })

</script>

DIV我试图分手

        <div id="paging_container3" class="container">
            <h2>Custom List Size</h2>
            <div class="alt_page_navigation"></div>
            <ul class="alt_content">
                 <li><p>One</p></li> 
                 <li><p>Two</p></li> 
                 <li><p>Three</p></li> 
                 <li><p>Four</p></li> 
                 <li><p>Five</p></li> 
                 <li><p>Six</p></li> 
                 <li><p>Seven</p></li> 
                 <li><p>Eight</p></li> 
                 <li><p>Nine</p></li> 
                 <li><p>Ten</p></li> 
                 <li><p>Eleven</p></li> 
                 <li><p>Twelve</p></li> 
                 <li><p>Thirteen</p></li> 
                 <li><p>Fourteen</p></li> 
                 <li><p>Fifteen</p></li> 
                 <li><p>Sixteen</p></li> 
            </ul>   
        </div>

Answer 1

把你的 $('#paging_container3').pajinate(); $(document).ready();函数内的函数。

pajinate代码在加载#paging_container3之前执行。我相信。

为什么不是这个分页工作

1 个答案: