$.when 不等待 Ajax 请求完成答案

【问题标题】：$.when not waiting for Ajax request to finish$.when 不等待 Ajax 请求完成
【发布时间】：2014-02-19 18:16:49
【问题描述】：

我想首先使用 Backbone.js 渲染一个视图，该视图显示从服务器拉取的文章。然后我想将此标记为“已看到”并将未看到消息的计数返回给路由器，因为它需要可供其他视图使用。

所以在我的路由器中，我有：

    getArticle: function (id) {

        require(["app/models/article", "app/views/Article"], function (models, Article) {

                var article = new models.Article({id: id});

                article.fetch({
                    success: function (data) {

                        var articleView = new Article({model: data, message_count:that.message_count});

                        slider.slidePage(articleView.$el);

                        $.when(articleView.saveView()).done(function(data){
                            console.log('in when and data is ');
                            console.log(data);
                        });

                    },
                    error: function(){
                        console.log('failed to fecth artcie'); 
                    }
                });

        });
    },

文章视图中的 saveView() 是：

    saveView: function(){

        var viewDetails = [];

        viewDetails.device_id = this.options.device_id;
        viewDetails.article_id = this.model.id;
        viewDetails.project_title = project_title;

        var article_view = new models.ArticleView();

        article_view.save(viewDetails, 
                        {
                        success: function(data) {
                                var count = data.get('count');   
                                console.log('in saveView() success and count is ');
                                console.log(count); 
                                return count;     
                            },
                            error:   function(model, xhr, options){
                               console.log(xhr.responseText);
                            },
                        });
    },

这会访问一个 REST API，记录文章的查看情况，然后返回未查看文章的计数。这导致控制台输出：

在什么时候和数据是 router.js:286 undefined router.js:287 in saveView() 成功和计数是 Article.js:45 4

因此，不知何故，$.when 无法正常工作，因为它在执行 .done 脚本之前没有等待 Ajax 请求发送。有任何想法吗？

【问题讨论】：

我相信saveView() 需要返回一个jQuery 延迟对象，以便$.when() 正确等待
ajax 调用在哪里？这将返回一个延迟对象，您只需将其冒泡即可。
@Liam .save() 是 Backbone.js ajax 调用
@Bojangles 谢谢，那行得通。你能说出答案吗？

标签： javascript jquery ajax backbone.js .when

【解决方案1】：

你需要返回一个 jQuery Deferred 对象，$.when 才能正常工作：

return article_view.save(viewDetails, 
    {
    success: function(data) {
            var count = data.get('count');   
            console.log('in saveView() success and count is ');
            console.log(count); 
            return count;     
        },
        error:   function(model, xhr, options){
           console.log(xhr.responseText);
        },
    });

Backbone 的 save() 方法 returns a jqXHR object 在这种情况下与 Deferred 对象的行为方式相同。只需像上面那样链接返回调用。这应该让$.when() 等待请求完成。

【讨论】：