Waypoints - 没有传递给 Waypoint 构造函数的元素选项答案

【问题标题】：Waypoints - No element option passed to Waypoint constructorWaypoints - 没有传递给 Waypoint 构造函数的元素选项
【发布时间】：2016-10-26 02:01:19
【问题描述】：

我在我的 rails 项目中使用航路点。（使用 gem waypoints_rails）

Waypoints 在我希望它运行的页面上运行良好。我使用航点的元素仅存在于此页面上。我正在使用 Waypoint Inview。

var inview = new Waypoint.Inview({
  element: $('#the-element')[0],
  entered: function(direction) { 
     console.log("working");        
  }
});

这工作正常。

但是，我的主页现在出现了这个错误：

 Uncaught Error: No element option passed to Waypoint constructor

有什么帮助吗？

【问题讨论】：

标签： jquery ruby-on-rails jquery-waypoints

【解决方案1】：

我遇到了同样的问题。尝试将您的航点包装在条件中以检查页面上是否存在该元素。

if ( $( "#the-element" ).length ) {
    var inview = new Waypoint.Inview({
        element: $('#the-element')[0],
        entered: function(direction) { 
           console.log("working");        
        }
    });

}

【讨论】：

【解决方案2】：

此消息通常表示 Jquery 未找到 HTML 元素。检查这个工作示例（jquery 3.2.1 / waypoint 4.0.1）：

var waypoint = new Waypoint({
element: document.getElementsByClassName('element-features'),
handler: function(direction) {
  if (direction == "down") {
    $('nav').addClass('sticky');
  } else {
    $('nav').removeClass('sticky');
  }
},
offset: '60px'
});

根据您在 HTML 元素中使用的定义（类或 ID）使用 getElementsByClassName 或 getElementsByID。

<section class="element-features">

【讨论】：

【解决方案3】：

我只添加下一个文件jquery.waypoints.min.js，*此脚本需要位于工作代码的底部：

<script type="text/javascript" src="assets/js/jquery.waypoints.min.js"></script>

这段代码可以正常工作：

var $firstCTA = $('#firstCTA');

    $firstCTA.waypoint(function () {
    
        alert('WE ARE HERE');
    
    })

【讨论】：