исправить приращение переменной в JavaScript

Question

Я кодирую тему WordPress и хочу увеличить кнопку загрузки еще.Я не всегда использую WordPress, и у меня впервые возникает такая проблема с переменной JavaScript.Переменная pull_page фактически не будет увеличиваться, и каждый раз, когда скрипт будет запускаться, он получит только две страницы.Есть ли какая-либо ошибка в коде, и как я могу это исправить?

$('#load-more').on('click', function(e){
  e.preventDefault();
  var pull_page = 1;
  var jsonFlag = true;

  if(jsonFlag){
    pull_page++;

    $.getJSON("/beta/wp-json/portfolio/all-posts?page=" + pull_page, function(data){
        if(data.length){
        $.each(data, function(i, item){
          var html = '<div class="card">';
          html += '<a href="'+ item.permalink +'">';
          html += '<img class="card-img-top w-100" src="'+ item.featured_img_src +'" id="case-studies" />';
          html += '<div class="overlay"><h4 class="text-center" id="client-name">'+ item.title +'</h4></div>';
          html += '</a>';
          html += '</div>';
          $('body').find('.card-columns')
          .append(html);
        });
      }
      else{
        jsonFlag = false;
      }
    }).done(function(data){
      if(data.length >= 4){
        jsonFlag = true;
      }
      else{
        jsonFlag = false;
      }
    });
    }

  }); // end load more

Answer 1

Вы сбрасываете pull_page на 1 каждый раз, когда нажимаете кнопку «Загрузить еще».

Переместите ее наружу.

var pull_page = 1;
$('#load-more').on('click', function(e) {
    ...