javascript - 修复 Jquery Waypoint

Question

美好的一天，我正在尝试自学 Jquery 航路点，但现在我无法让它发挥作用。这个想法是一旦元素在屏幕上可见，它就会显示一个“警告”，说“这个元素是可见的”。但是每当我向下滚动时，警报似乎都没有出现。这是我的代码示例。

HTML

<section class="container">
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item"></div>
    <div class="sixteen columns item thing entry" id="example-basic"></div>
</section>

如果我将此部分放在其他部分之上，它似乎可以正常工作并显示警报

<div class="sixteen columns item thing entry" id="example-basic"></div>

Javascript

<script>
$('.entry').waypoint(function() {
   alert('The element appeared on the screen.');
});
</script>

Answer 1

尝试用 doc ready handler 包装它:

<script>
   $(function(){
      $('.entry').waypoint(function() {
         alert('The element appeared on the screen.');
      });
   });
</script>