javascript - $.when 不适用于 $.scrollTo 插件

Question

我使用scrollTo插件，我想在工作警报功能之后滚动我想要的位置。我的原型代码就是这样。它不起作用，我的错误是什么？

 $.when(function () {
        $.scrollTo('#documentsFieldset', 1000);
    }).done(function () {
        alert('completed');
    });

Answer 1

$.when只接受deferreds和promises。不幸的是，$.scrollTo没有返回任何东西，undefined所以这是行不通的。

当您尝试将$.scrollTo的结果传递给 时$.when，它会原谅您并将其视为“没有给出任何承诺”，并立即返回一个承诺。因此，您的done回调会立即被调用，并且不会等待滚动完成。

一种解决方案是将回调作为第三个参数传递，或者将其设置为第三个参数的onAfter属性：

$.scrollTo('#documentsFieldset', 1000, function() {
    alert('completed');
});
// or alternatively, e.g. if you need to pass more settings
$.scrollTo('#documentsFieldset', 1000, {
    onAfter: function() {
        alert('completed');
    }
});

另一种解决方案是创建一个包装器，该包装器$.scrollTo返回一个承诺，这样您就可以在$.when调用中愉快地使用它来将它与其他异步内容结合起来。我继续尝试这个，去看看小提琴。

Answer 2

您已将对 scrollTo 的调用包装在不返回延迟对象的匿名函数中。 如果您只想在 scrollTo 完成时做出反应，则以下内容就足够了：

$.when(
       $.scrollTo("#selector", 1000)
).done(function(){
     console.log("scroll finished");
});

编辑：我错误地认为 $.scrollTo 会返回一个延迟对象 - 它没有！但是 API 提供了 onAfter 回调。所以解决方案看起来像这样：

$.scrollTo("#selector", 1000, {
   onAfter: function() {
      console.log("done!");
   }
});