«Загрузить больше» с помощью jQuery AJAX XML

#jquery #xml #ajax

#jquery #xml #ajax

Вопрос:

Я создаю веб-сайт для отображения большого количества документов (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?

Ответ №1:

одним из вариантов было бы добавить счетчик в блок «каждый». так что, когда вы достигнете 20, вы завершите выполнение скрипта.