创建自定义 jquery 不定式婴儿车，发送请求后如何打开和关闭滚动条？

Question

我希望在使用 $(document).off('scroll');

关闭它时能够打开 $(document).on('scroll', function() {...});

到目前为止，我的代码尝试使用去抖动功能，但我得到

Illegal invocation

function scroller(lang, type, genre, sort, page) {
    console.log($(this).scrollTop() * 2, $('#pages').position().top);
    if ($(this).scrollTop() * 2 >= $('#pages').position().top) {
        $.post('<?= (new UrlLibry)->SetUrl('bookshop', 'jajax', 'page'); ?>', {lang: lang, type: type, genre: genre, sort: sort, pages: page}, function(data) {
            $('#loadmore').append(data);
            page++;
            $('#pageNumber').data('page', page);
        });
    }
}

var debouncedMouseMove = debounce(scroller, 50);
$(document).on('scroll', debouncedMouseMove);

Answer 1

您可以将处理函数与 .on() 调用分离。

此外，如果您将所有内容都替换为去抖功能，您需要继续考虑该功能必须只有一个参数：事件。

我使用了 underscorejs 库中包含的 debounce 函数。

function scroller(event) {
  console.log('called...');
  return;

    var lang, type, genre, sort, page; // cannot pass as argument
    console.log($(this).scrollTop() * 2, $('#pages').position().top);
    if ($(this).scrollTop() * 2 >= $('#pages').position().top) {
        $.post("<?= (new UrlLibry)->SetUrl('bookshop', 'jajax', 'page'); ?>",
                {lang: lang, type: type, genre: genre, sort: sort, pages: page}, function(data) {
            $('#loadmore').append(data);
            page++;
            $('#pageNumber').data('page', page);
        });
    }
}

var debouncedMouseMove = _.debounce(scroller, 50);
$(document).on('scroll', debouncedMouseMove);

body {
    height: 400vh;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>

创建自定义 jquery 不定式婴儿车，发送请求后如何打开和关闭滚动条？

Creating custom jquery infinitive stroller, how to turn scroll on and off after sending request?

jquery

infinite-scroll