在简单示例中未检测到滚动事件

Question

以下简单示例我没有收到警报，有人可以帮助我吗？

$(document).ready(function() {
  $(window).scroll(function() {
    alert("Hi!");
  });
});

<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
</body>

</html>

我希望 "Hi!" 每当我在页面上滚动时都会提醒。

Answer 1

您的代码有效，您只需要在 body 中包含一些比 window 更高的内容，这样页面就会实际滚动：

div { height: 2000px; }

<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $(window).scroll(function() {
        alert("Hi!");
      });
    });
  </script>

</head>

<body>
  <div>Some content...</div>
</body>

</html>

Answer 2

我认为您的页面需要内容才能正常工作。现在 'see' 你的 window

Answer 3

很正常，因为没有调用scroll事件。您的 body 应该足够高以允许滚动事件。在您的代码中，您还没有内容。尝试添加一些 height.

大的内容

<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $(window).scroll(function() {
        alert("Hi!");
      });
    });
  </script>

</head>

<body>
  <div>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br>Scroll now<br></div>
</body>

</html>

Answer 4

先给body加高

body{ height:1200px; }

那就试试这个

$(window).on('scroll',function(){ alert('Hi'); });

在简单示例中未检测到滚动事件

Scroll event not getting detected in simple example

html

javascript

jquery

scroll

jquery-events