滚动事件在移动设备上不起作用

Posted 2023-03-14

技术标签:

【中文标题】滚动事件在移动设备上不起作用【英文标题】：scroll event not working on mobile 【发布时间】：2017-06-25 08:28:02 【问题描述】：

Setch.me 在桌面上正常加载，但在移动设备上不会触发，除非我点击摄影师/化妆师，我在此处搜索解决方案后添加了 height=device-height，但没有奏效。

$(window).scroll(function()  
    if($(window).scrollTop() + $(window).height() >= $(document).height())  
        track_page++; 
        load_contents(track_page);

【问题讨论】：

jQuery live scroll event on mobile (work around)的可能重复 【参考方案1】：

试试这个：

$(document.body).on('touchmove', onScroll); // for mobile
$(window).on('scroll', onScroll); 

// callback
function onScroll() 
    if( $(window).scrollTop() + window.innerHeight >= document.body.scrollHeight )  
        track_page++; 
        load_contents(track_page);

【讨论】：

成功了，非常感谢，所以第二个检测到任何类型的滚动，即使它没有到文档的末尾？ @Krim - 任何触摸移动都意味着它的含义:) 当手指在屏幕上移动时它会触发回调，并且滚动可能是其中的副产品。它适用于我的 document.body.scrollHeight-100 额外空间！谢谢！在移动端，任何触摸移动（上移、下移）也调用该函数！【参考方案2】：

var addition_constant = 0;
$(document.body).on('touchmove', onScroll); // for mobile
$(window).on('scroll', onScroll);

function onScroll() 
  var addition = ($(window).scrollTop() + window.innerHeight);

  var scrollHeight = (document.body.scrollHeight - 1);
  if (addition > scrollHeight && addition_constant < addition) 

    addition_constant = addition;

    loadmorecontest();

【讨论】：

谢谢兄弟.. window.innerHeight 对我来说很棒..【参考方案3】：

您好，您没有正确关闭您的活动，应该是这样的：

$(window).scroll(function()  
if($(window).scrollTop() + $(window).height() >= $(document).height())  
    track_page++; 
    load_contents(track_page); 
);

【讨论】：

不是他没有“关闭”的事件，而是回调函数。【参考方案4】：

除了之前的cmets，$(window).scrollTop() 好像不能在手机上工作，应该换成document.body.scrollTop

【讨论】：

【参考方案5】：

这似乎有点无关紧要，但因为我发现自己在这里并且我无法正常工作的原因是我试图滚动的元素；

overflow-y: hidden

当我删除它时，它工作得很好。我只是为了如果它也是某人的情况而写的。

【讨论】：