理解 $.Deferred() 序列和 $.fn.pipe()

Question

我陷入了这段代码：

reload: function() {
            var self = this;
            $.when(self.unload()).then(function() {
                self.load();
            });
        },
load: function() {
            var self = this;
            $.ajax({
                url: self.options.url,
                success: function(data) {
                    $.Deferred(
                        function(dfr) {
                            $.each(data, function() {
                                var div = $('<div></div>')
                                    .addClass('nw-item')
                                    .html('newsitem.ejs', this)
                                    .hide()
                                    .appendTo(self.element);
                                dfr = dfr.pipe(function() {
                                    return div.slideDown(self.options.speed);
                                });
                            });
                        }).resolve();
                }
            })
        },
unload: function() {
            var items = this.element.children('.nw-item').reverse(),
                self = this,
                udfd = $.Deferred(
                    function(dfr) {
                        $.each(items, function() {
                            var div = $(this);
                            dfr = dfr.pipe(function() {
                                return div.slideUp(self.options.speed);
                            });
                        });
                    }).resolve();
            return udfd;
        }

在“重新加载”中，我需要在“卸载”序列完成后启动“加载”序列，但它在“卸载”序列元素的第一次迭代被隐藏后立即启动。请帮助我，我被困住了（

Answer 1

未经测试，但尝试以下操作：

unload: function() {
    var items = this.element.children('.nw-item').reverse();
    var self = this;
    var udfd = $.Deferred();
    var chain;
    $.each(items, function() {
        chain = udfd.pipe(function() {
            return $.Deferred(function(deferred) {
                div.slideUp(self.options.speed, function() {
                    // callback function gets executed when slideUp is done
                    deferred.resolve();
                });                
            }).promise();
        });
    });
    chain.done(function() {
        udfd.resolve();
    });
    return udfd.promise();
}

由于您的 jQuery.slideUp 函数是异步的，但不会返回延迟对象，例如 jQuery.ajax，因此您必须手动返回延迟/承诺。当你的管道函数链完成后，它会解析主要的 Deferred。不要忘记返回主要 Deferred 的承诺。

就像我说的，不能保证，但你可以尝试一下！