javascript - 好的，我已经获得了 bit.ly 链接，但现在 jQuery 的异步性妨碍了我

Question

function dlLink(title, currentArray, currentIndex, currentOpts) 
    {
        var img = new Image();
        img.src = 'Gallery/Wallpapers/' + title;
        html = img.width + ' x ' + img.height + '<br />'
                + '<a class = "nav" href = "Gallery/Wallpapers/' + title + '" target = "_blank">Download</a><br />http://';

        // set up default options
        var defaults = {
            login:      '*************',
            apiKey:     '*******************************',
            longUrl:    'http%3A%2F%2Fschnell.dreamhosters.com%2Fwallpapers.php%3Fwp=' + title
        };

        // Build the URL to query
        var daurl = "http://api.bit.ly/v3/shorten?"
                    + "&login=" + defaults.login
                    + "&apiKey=" + defaults.apiKey
                    + "&longUrl=" + defaults.longUrl
                    + "&format=json&callback=?";

        // Utilize the bit.ly API
        $.getJSON(daurl, function(results)  {
            $('#fancybox-title').append(results.data["url"].substr(7));
        });

        if(img.complete)
            return html;
    }

好吧，这个函数的重点是它是对 Fancybox 的回调，将 HTML 内容放入其“标题”部分。在本节中，我放置了图像的分辨率、下载链接和用于返回此网站上的图像的 bit.ly 链接 - http://schnell.dreamhosters.com/wallpapers.php?page=12最初我遇到了 bit.ly URL 的 XMLHTTPRequest 问题，但我似乎已经解决了这些问题。

现在的问题是，我需要变量“html”来在 return 语句出现之前将所有 html 内容放入 fancybox 中。虽然看起来一切都发生在 return 语句之前，但 jQuery 正在异步执行 $.getJSON() 函数，因此不能保证 'html' 在 dlLink 结束之前会在其中包含内容。我需要一种方法来实现它，以便事情发生的顺序如代码中所示，以便 $.getJSON 请求和后续回调函数始终在进入 return 语句之前完成它们正在做的事情。

编辑 - 我想出了要做什么，上面的代码正确地按照我的意愿做了。请参阅下面我的回答。

Answer 1

好吧，在意识到一些事情后我终于解决了这个问题。

1 - 在 $.getJSON() 的回调函数中，您应该对 JSON 数据完成所有可以完成的工作。

2 - 我试图放置链接的区域的 ID 为“fancybox-title”，所以我直接说 $('#fancybox-title').append(stuff);

3 - Fancybox 的标题(至少在内部显示时)将仅根据格式化标题的函数完成时已经存在的文本行调整自身大小。之后附加的任何内容都不会考虑大小，因此标题区域将保持不变，您会看到文本行爬入图片中(很难发现这一点)。为了解决这个问题，我确保将第三行文本添加到我的“html”变量中 - <br />http://这使得 Fancybox 的标题区域大小为 3 行文本。然后在回调函数中，我使用 substr 获取从 http://之后开始到结束的 bit.ly 链接。