Счетчик видимых элементов на странице и обновляется при нажатии пользователем кнопки загрузить больше js

#javascript

Вопрос:

Привет, так что у меня вроде как все получилось. Так что прямо сейчас он отображает количество как 12 по умолчанию, что правильно, но когда я нажимаю «Загрузить больше», счетчик не обновляется, чтобы отразить 24 элемента, которые видны, если я нажму «Загрузить больше» во второй раз, он скажет 24, когда к этому моменту должно быть 36. Я также хотел отобразить общую сумму независимо от того, был ли класс div скрыт или нет. пример 12 из 40.

https://codepen.io/nufftalon/pen/eYRgxeY

 
$(document).ready(function () {
  function articlecount() {
    var count = $(".content:visible").length;
    $("#count").html("Count : "   count);
  }

  $(".content").slice(0, 12).show();
  articlecount();
  $("#loadMore").on("click", function (e) {
    e.preventDefault();
    articlecount();

    $(".content:hidden").slice(0, 12).slideDown();
    if ($(".content:hidden").length == 0) {
      $("#loadMore").text("No Content").addClass("noContent");
    }
  });
});


 

Ответ №1:

Вы обновляете count значение перед отображением новых записей. Обновите его после:

 // show the records
$(".content:hidden").slice(0, 12).slideDown();
if ($(".content:hidden").length == 0) {
  $("#loadMore").text("No Content").addClass("noContent");
}

// update the count
articlecount();
 

Комментарии:

1. Слишком долго возился с этим, ха-ха, спасибо, что сделал свое дело!