Question

我正试图通过jquery在div中实现一个简单的“保持在视口内”的行为。为此我需要将一个函数绑定到窗口的滚动事件，但我似乎无法启动它：没有任何反应。我尝试过一个简单的alert（），console.log（）没有骰子。我知道我做错了什么？

此代码：

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

位于我的html文件最底部的script.js中

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>

Answer 1

您的CSS实际上是将文档的其余部分设置为不显示溢出，因此文档本身不会滚动。最简单的解决方法是将事件绑定到滚动的事物，在您的情况下为div#page。

因此改变很容易：

$(document).scroll(function() {  // OR  $(window).scroll(function() {
    didScroll = true;
});

到

$('div#page').scroll(function() {
    didScroll = true;
});

Answer 2

我的问题是我在我的css中有这个代码

html,
body {
    height: 100%;
    width: 100%;
    overflow: auto;
}

删除后，窗口上的滚动事件再次触发

Answer 3

$('#div').scroll(function () {
   if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight-1) {

     //fire your event


    }
}

Answer 4

似乎没有什么对我有用，但这就是诀窍

$(parent.window.document).scroll(function() {
    alert("bottom!");
});

Answer 5

无论你尝试过什么，它都不适合（像我一样）： <element onscroll="myFunction()"></element> 像魅力一样工作

Answer 6

Thr解决方案是：

 $('body').scroll(function(e){
    console.log(e);
});

Answer 7

就我而言，您应该将该函数放在$(document).ready

中

$(document).ready(function () {
    $('div#page').on('scroll', function () {
     ...
    });
});

Answer 8

尝试1）在<script>或2中声明您的jQuery <head>将.scroll()事件与$(document).ready()或3）包装在一起