Javascript 此上下文在my waypoints.js代码段中不起作用

我已经在这里混了一段时间了（jQuery.waypoints），基本上我正在尝试使用这个库向某个容器元素的子元素添加动画，我采用以下方式进行操作：

    var waypoints = $('#collection').waypoint(function() {
            $('#collection .col-md-3').each(function(){
                        var $this = $(this);

                        var elem_class = $(this).attr('data-anim-name');
                        var elem_delay = $(this).attr('data-anim-delay');

                        $this.css({
                            '-webkit-animation-delay' : elem_delay,
                            '-moz-animation-delay' : elem_delay,
                            'animation-delay' : elem_delay
                        });

                        $this.addClass(elem_class);

            });
    }, {
        offset: '25%'
    }); 

请注意，我在传递给路径点的函数中所做的选择：

$('#collection .col-md-3').each(function(){

现在，上面的代码工作正常，但是当我将上面的代码重新编写到：

$('.col-md-3' , this).each(function(){ 

我的代码不工作，就我而言，我的代码是完全正确的，因为

这个

确实是

#集合

。那么为什么代码不起作用呢

我的HTML结构如下所示：

<section id="collection">
  <div class="col-md-3"></div>
  <div class="col-md-3"></div>
  <div class="col-md-3"></div>
  <div class="col-md-3"></div>
</section>

有人能解释一下为什么在我的代码中这个用法根本不起作用吗？我错过了什么

多谢各位

---

Ale-x

在大多数jQuery函数中，您是对的-您可以使用

this

作为第二个参数的上下文，它通常绑定到正在处理的元素。但是，对于航路点，回调函数有一个不同的对象绑定为

this

。以下是从他们的网站上收集的一个示例：

因此，在航路点回调处理程序中，您可以使用

this.element

作为上下文：

var waypoints = $('#collection').waypoint(function() {
    $('.col-md-3', this.element).each(function(){
        var $this = $(this);
        //etc

---

查看其余的文档，我在API中找不到这种行为/功能的直接参考，因此它可能是也可能不是您在未来版本中工作时可以依赖的东西，而只是它如何实现的一个副作用。

非常感谢您费心，还有一个问题，你在控制台中查找了什么？我在他们的一个处理程序中插入了一个断点，然后在控制台中键入“this”，看看它是什么。你使用了chrome吗？很抱歉，我的问题是noob，但是你是如何插入断点的？是的，它是Chrome。要插入断点，请在“源”选项卡上找到感兴趣的代码，然后单击要打断的行号。如果您没有太多地使用开发工具，包括