JavaScript/jQuery未触发滚动事件

JavaScript/jQuery not triggering scroll event

本文关键字:滚动 事件 jQuery JavaScript      更新时间:2023-09-26

我正试图通过jQuery和JavaScript为我正在开发的wordpress网站触发滚动事件。

$(window).scroll(function() {
   var hT = $('#target').offset().top;
       hH = $('#target').outerHeight();
       wH = $(window).height();
       wS = $(this).scrollTop();
   console.log((hT-wH) , wS);
   if (wS > (hT+hH-wH)){
       console.log('working');
   }
});

控制台上什么也没发生。以下代码不起作用:

$(window).scroll(function() {
    console.log('scrolling');
});

两者都不做:

function scrollFunction() {
    console.log('scrolling');
}
window.onscroll = scrollFunction;

我在其他非wordpress项目上测试过这些行,甚至在codepen中也测试过,它们都能工作。我缺少什么?

我使用的是jQuery 12.2.2。此外,在同一个项目中,出于同样的目的,我无法制作Waypoints.js,正如我在另一个问题中发布的那样。

非常感谢您的帮助,谢谢!

您的代码已经在闭包中了吗?也许其他一些JavaScript与jQuery和使用$符号有冲突。

例如,这样包装以确保$是jQuery:

(function($){
  $(window).scroll(function() {
     var hT = $('#target').offset().top;
         hH = $('#target').outerHeight();
         wH = $(window).height();
         wS = $(this).scrollTop();
     console.log((hT-wH) , wS);
     if (wS > (hT+hH-wH)){
         console.log('working');
     }
  });
})(jQuery);

你试过这个吗?

<script>
window.onscroll = function() {scrolling()};
function scrolling() {
console.log("Scrolling");
}
</script>

尝试以下代码…:)

$(window).scroll(function(){});替换为$(window).on('scroll', function(){})

 $(window).on('scroll', function(){
   var hT = $('#target').offset().top;
       hH = $('#target').outerHeight();
       wH = $(window).height();
       wS = $(this).scrollTop();
    console.log((hT-wH) , wS);
       if (wS > (hT+hH-wH)){
         console.log('working');    
       }
});