1

所以我在一个 jQuery 页面上的 ListView 上进行延迟加载。当您单击 ListItem 时,它会将您带到详细信息页面。问题是,由于我已将scrollstop事件绑定到窗口,因此延迟加载仍会尝试在详细信息页面上触发。

$("#index").on("pageshow", function () {
  //get initial list view data

  var inital = $('#filters').serialize(); //gets 'filter' params for data-access
  RetrieveMeetings(inital);  //Populate initial set

  //lazy load
  //Window Event From: http://stackoverflow.com/questions/9983835/detect-if-user-has-scrolled-to-the-bottom-of-a-div
  $(window).bind('scrollstop', function () { //this also fires on details page!!!
    var screenBottom = $(this).scrollTop() + parseInt($(window).height());
    var $div = $('#meetings-list');
    var divBottom = $div.offset().top + parseInt($div.height());

    if (screenBottom > divBottom) {
       var values = $('#filters').serialize();
       LoadMoreMeetings(values);
    }
  });

  //new dataset from filter forum
  $("#submit").click(function (event) {

    /* stop form from submitting normally */
    event.preventDefault();
    var values = $('#filters').serialize();
    ResetMeetingList();
    RetrieveMeetings();

  });

});

我可以通过page从事件的 DOM 中删除 来解决这个问题,pagehide但是每当用户返回 ListView 时,我就会丢失过滤器论坛的页面状态(这也会增加页面加载时间)。

    //remove pages from DOM on hide
    $(document).on("pagehide", function (e) {
        $(e.target).remove();
    });

有没有办法将scrollstop事件附加到page而不是window

这种方法的另一个问题是,如果屏幕足够大,可以在没有滚动条的情况下加载页面,那么延迟加载显然不会触发!也许这个问题有更好的整体解决方案?

4

0 回答 0