Question

我正在制作一个网站，在一个页面中显示大量文档（PDF和JPG），我担心页面加载时间和服务器负载，因为有很多文件。我将文件数据存储在XML文件中，并使用jQuery和AJAX检索数据。

jQuery的：

$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "scripts/imagenes.xml",
        dataType: "xml",
        success: function(xml) {
            $(xml).find('imagen').each(function() {
                var path = $(this).find('path').text();
                var img = $(this).find('img').text();
                var thumb = $(this).find('thumb').text();
                $('<a rel="lightbox" href="'+path+img+'">').html('<img src="' + path + thumb + '" /></a>').appendTo(".item_aesmr_img_hola");
            });
        }
    });
});

XML：

<?xml version="1.0" encoding="UTF-8"?>
<instituciones>
  <aesmr>
    <carnets>
      <imagen>
        <path>docs/aesmr/carnets/</path>
        <img>aesmr-carnet-016b.jpg</img>
        <thumb>thumbs/aesmr-carnet-016b.jpg</thumb>
      </imagen>
      <imagen>
        <path>docs/aesmr/carnets/</path>
        <img>aesmr-carnet-025b.jpg</img>
        <thumb>thumbs/aesmr-carnet-025b.jpg</thumb>
      </imagen>
      ...and so on...
    </carnets>
  </aesmr>
</instituciones>

我认为使用典型的Load more...按钮是一个不错的主意，只是为了让用户在需要时加载图像，一次增加20个图像。单击缩略图时，加载完整图像时加载拇指。

有没有办法只加载前20个结果，然后使用按钮再显示20个？

Answer 1

一个选项是在“each”块中添加计数器。这样当你达到20时，就会终止脚本的执行。

使用jQuery + AJAX + XML“加载更多”

1 个答案: