загружать страницы с помощью кнопки «загрузить еще»

Question

загружать страницы с помощью кнопки «загрузить еще»

0

У меня есть сценарий, который использует число pagelinks для отображения следующих и предыдущих страниц:

prev 1 2 3 4 5 6 7 8 9 10 следующая

И URL-адрес изменится на www.domain.com/?page=2. Я хотел бы изменить его на кнопку (загрузить больше), которая добавляет новые данные. До сих пор я получил этот javascript:

        <script type="text/javascript">
$(document).ready(function() {


var new_btn = $('<div id="gig-more" class="gig-load-more" style="display: block;">   <button id="btn-white"  type="button" class="btn-standard-lrg btn-white"">Load More</button></div>');
  new_btn.insertAfter('#frame{$currentpage+1}');

  $('#btn-white').click(function() {


$.get('?page={$thenextpage}  ', function(html){ 
  $(html).find("#testframe").appendTo("div#testframe");
});
});
});
 </script>

{$ currentpage} и {$ thenextpage} используются сменные переменные

Нажав кнопку на странице (1), она правильно загрузит страницу (2). Однако, если кнопка снова нажата, она снова и снова загружает вторую страницу.

Как я могу это достичь?

everestbux 01 дек. 2013, в 19:33

Источник

Теги:

javascript

jquery

html

button

1 ответ

Ещё вопросы

Francisco Presencia · Accepted Answer · 2013-12-01T15-09-00.000Z

Думаю, вы слишком усложняете это. Вам это не нужно. Это все:

<script type="text/javascript">
// Store what page to load next
nextpage = 2;

$('#load_more').click(function(event) {
  // Retains compatibility for those with no javascript
  event.preventDefault();

  // Fetch the data
  $.get('/ajax.php?page=' + nextpage, function(html){

    // Put the data where it belongs. I like it more this way
    $("div#testframe").append(html);

    // Keep the counter up-to-date
    nextpage++;
    });

  });
</script>

Однако вам нужно еще пару изменений. Вам нужно добавить в свой html эту кнопку:

<a href = "?page=2" id = "load_more">Load more</a>

Обратите внимание, что это делает его обратно совместимым для тех, у кого нет javascript, таких как веб-сканеры, в то время как он увеличивает опыт, соответствующий вашим требованиям для тех, у кого он есть.

И создайте ajax.php, который похож на текущий index.php, но он загружает только нужные данные, так как вы не хотите, чтобы пользователь загружал кучу вещей, которые никогда не будут использоваться.

Большое спасибо, Франциско, твой ответ действительно помог мне получить то, что я хочу, я просто немного изменил, чтобы соответствовать моему сценарию.