Question

我正在为API调用网站编写代码作为练习。我已经编写了一个函数来获取数据，另一个函数用于向页面呈现文章片段。我的目的是能够清除页面以显示完整的文章内容。

我正在使用jQuery函数来实现这一目标。我的问题是，在调用用于呈现文章片段的函数之后，我无法调用master部分中的任何其他函数（因为控件似乎仍然位于www函数内）。

我希望能够从master调用www，但事实并非如此。但是，如果我从$(document).ready()函数内部调用它，它就可以工作。

所以我的问题是：如何在致电renderSnippet后回到News.clearView部分？我尝试过$(document).ready()语句，但没有帮助。

apiquery.js

renderSnippet

谢谢！

Answer 1

您可以像使用get函数一样使用回调方法。

 renderSnippet: function(quantity, query,callback) {
    News.get(query, function(data) {
    $.get("views/home.html", function(contents) {
        // renders snippets to home page
        for(var i = 0; i < quantity; i++) {
            var helper = contents;
            helper = helper.replace("${Title}", data[i].webTitle);
            helper = helper.replace("${Snippet}", data[i].fields.standfirst);
            $('div.news').append(helper);
        }
        //News.clearView(); // This one works
         calllback();
    }, 'html');

    });
},

在准备好的文件中你可以像这样打个电话

News.renderSnippet(10, "q=technology&show-fields=all&api-key=test",function(){
    News.clearView();
});

Answer 2

这是因为$.get是异步函数。因此，当您调用News.renderSnippet时，它会立即执行$.get，并且在您传递给$.get的回调执行之前，您的News.clearView方法已经执行

您必须更改News.renderSnippet以接收回调函数，然后按以下方式调用它：

renderSnippet: function(quantity, query, cb) {
    News.get(query, function(data) {
      $.get("views/home.html", function(contents) {
        // renders snippets to home page
        for(var i = 0; i < quantity; i++) {
            var helper = contents;
            helper = helper.replace("${Title}", data[i].webTitle);
            helper = helper.replace("${Snippet}", data[i].fields.standfirst);
            $('div.news').append(helper);
        }
        cb();
      }, 'html');
    });
}

因此，在$(document).ready事件中，您可以执行以下操作：

$(document).ready(function() {
    News.renderSnippet(10, "q=technology&show-fields=all&api-key=test", function() {
        News.clearView(); // This will work
    });
});

如何将控制权交还给main函数--jQuery，JS

2 个答案: