Question

点击加载更多按钮将增加一个数字，然后将该值传递给“ start-index” json url。然后它将新项目附加在当前项目之下。

导航/单击首页和标签时，应在加载新项目之前清除当前项目。

我的解决方案是添加另一个click事件以重置数字增量并删除当前项目。

$("#label-list a").on("click", function() {
  $("#count").val("1");
  $('.items').remove();
});

似乎正常，但是我发现了一个问题。

例如，您在label2中，再次单击label2将使所有项目消失并重置起始索引值。

实际上，单击功能不是问题，这就是它的行为方式，我只需要另一个解决方案... 任何帮助，将不胜感激。谢谢！

var max = 4;
var winloc = window.location;
baseUrl = 'https://mailliw88.blogspot.com/feeds/posts/';

$("#add").on("click", function() {
  start = (parseInt($('#count').val()) + max);
  $("#count").val(start);
  loadmore(start);
})
$("#label-list a").on("click", function() {
  $("#count").val("1");
  $('.items').remove();
});

$(window).on('hashchange', loadmore = function(more) {
  if (winloc.hash === "#home") {
    url = `${baseUrl}default?start-index=${more}&max-results=${max}&alt=json-in-script`;
  } else if (winloc.hash.indexOf("#label") > -1) {
    label = winloc.hash.split("/")[1];
    url = `${baseUrl}default/-/${label}?start-index=${more}&max-results=${max}&alt=json-in-script`;
  } else {
    url = `${baseUrl}default?start-index=${more}&max-results=${max}&alt=json-in-script`;
  }

  $.ajax({
    url: url,
    type: 'get',
    dataType: "jsonp",
    success: function(data) {
      if (data.feed.entry) {
        datas = data.feed.entry;
        var entry = data.feed.entry;
        for (var i = 0; i < entry.length; i++) {
          postTitle = entry[i].title.$t;
          items = '<div class="items"><h2>' + postTitle + '</h2></div>';
          $("#showlists").append(items)
        }
      }
      if (data.feed.entry.length !== max){
        $("#add").hide();
      } else if (window.location.href) {
        $("#add").show();
      }
    }
  });
}).trigger('hashchange')

 <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <ul id='label-list'>
    <li><a href="#home">Home</a></li>
    <li><a href="#label/label2">label2</a></li>
    <li><a href="#label/label3">label3</a></li>
  </ul>
  <div id='showlists'>
  </div>
  <input type="button" id="add" value="load more..." style="width:200px">
  <input type="text" id="count" value="1" style="width:30px">

从ajax响应onclick中删除元素

0 个答案: