Javascript 如何在等待多个异步JSONP回调时显示加载消息？

我正在构建一个客户端应用程序，向YouTube API、Instagram API、Tumblr API发送请求。处理这些请求时，将执行相应的回调函数

问题是YouTube总是先完成，通过underline.js模板将数据附加到HTML。几秒钟后，Instagram和Tumblr的结果也被追加

Myapp.js文件包含3个单独的纯javascript函数：

function showYoutube() { ... }
function showInstagram() { ... }
function showTumblr() { ... }

在成功完成所有3个回调函数之前，如何显示一条简单的“正在加载…”消息

更新： 仍在寻找可能的解决方案。请注意，我没有后端服务，因此我仅限于JSONPAPI请求

我的API调用位于index.html中，如下所示：

<script 
    type="text/javascript" 
    src="http://gdata.youtube.com/feeds/users/GoogleDevelopers/uploads?v=2&alt=json-in-script&format=5&callback=showMyVideos">
</script>

---

因此，函数

showMyVideos（）

必须在全局范围内。我尝试过实现jQuery-defered和Async.js-Parallel，但运气不好。

使用承诺模式，在n项执行完毕后，可以启动函数/回调。因此，您可以显示一个微调器，启动三个异步函数，然后在完成所有三个之后，启动一个函数以移除微调器

---

jQuery有承诺，如果您使用下划线，我认为您可以使用下划线。deferred（我相信…我使用jQuery）

您还可以使用同样适用于客户端的非常出色的库

在这种情况下，最好使用syncjsonp调用，因为wellsync将为您实现和控制异步部分

//show loading icon
async.parallel([
    function (callback) {
        showYoutube() // have showYoutube() declared outside async.parallel 
                      // otherwise it will be inaccessible to the rest of your app.
        callback()
    },
    function (callback) {
        //send off to instagram
        callback()
    },
    function (callback) {
        //send off to tumblr
        callback()
    }
], function () {
    //all are done, hide loading icon
})

---

未捕获引用错误：未定义showYoutube。JSON-P回调找不到该函数，因为它位于async.parallel对象内部。“我做错什么了吗？”我现在明白了。因此，如果可以的话，不要在异步外部使用jsonp，而是在异步内部使用jsonp？这可能会使回调函数可访问。但它可能在全球范围内寻找它是的。。。嗯，让我想一想，这很有趣。像这样实现jsonp会很好，因为它都包含在async->parallel->函数中。有什么东西阻止你这么做吗？你发布的链接有一个巧妙的解决方案，使用

$.getJSON

。“今晚我会试试，然后在这里汇报。”TwilightPonyInc。是的，有几种不同的方法。期待它你的三个功能有什么回报？@Beetroot-Beetroot-Nothing。它们在完成时将元素附加到DOM中。My index.html包含下划线.js模板。JSONP回调函数获取该模板，对其进行解析，并将div元素（pinterest样式）附加到主容器中。为了在所有三个函数都成功完成时执行某些操作，您需要从每个函数返回一个承诺，这样您就可以在一个公共范围内拥有所有三个承诺。如果您可以修改您的问题，将（简化的）代码至少包含在三个函数中的一个函数中，我将看看是否可以向您展示如何使jQuery延迟/承诺对您有效。。。。当你这么做的时候，记得在这里贴一条评论（里面有@Beetroot-Beetroot）来提醒我。