了解航点基础知识

时间:2016-03-14 14:04:35

标签: jquery jquery-waypoints

我正在尝试使用流行的“Waypoints”jQuery库。我查看了各种示例和文档,但我很难掌握如何访问附加到航点的元素。

为了更清楚,我有几个属于.nudgedown类的页面部分。我想让它们在滚动后更改背景颜色。我试图通过使用以下代码警告其初始背景颜色来查看是否有任何工作:

$(".nudgedown").waypoint(function(){
    alert($(this).css("background-color"));
});

然而没有任何反应,在控制台中我收到此错误:

  

TypeError:b.ownerDocument未定义

我做错了什么?在我的方法中,我是否在概念上遗漏了什么?在此先感谢您的帮助。

1 个答案:

答案 0 :(得分:1)

您好,尝试使用$(this)获取错误的元素。你可以试试这个:



$(document).ready(function(){
	var waypoints = $('.nudgedown').waypoint({
              handler: function(direction) {
              var el=$(this).get(0).element;
              console.log($(el).css("background-color"));
            }
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.0/jquery.waypoints.js"></script>
<div style="background-color:blue; height:50px"></div>
<span class="nudgedown" style="background-color:red;">test</span>
<div style="background-color:green; height:800px"></div>
&#13;
&#13;
&#13;

结果

enter image description here