3

我有一个基本功能,我试图从 bit.ly 返回一个缩短的 url。我的用户名和 api_key 刚刚在这篇文章中被删除,但它们已经过测试,我得到了正确的回复。我们还进行了检查,我们收到了包含正确数据的 JSON 响应。

我遇到的问题是我希望这个函数成为我们可以在网站上的不同位置调用的东西,以缩短将包含在推文中的链接。所以这个想法只是编写一个我们可以及时调用的函数,因为我们特别知道会从推文中发送一些东西,并且需要动态调用页面的 url。

当 url 传递给函数时,我们将 undefined 作为返回值。这里的功能:

    var UrltoShorten = 'http://google.com',
        bitly = shortenUrl(UrltoShorten);

    function shortenUrl(longUrl) {

        var username = 'removed',
            key = 'removed';

        $.ajax({
            url: 'http://api.bit.ly/v3/shorten',
            data: { 
                longUrl: longUrl,
                apiKey: key,
                login: username
            },
            dataType: 'jsonp',
            success: function (v) {
                var shortUrl = v.data.url;
                return shortUrl; 
                //console.log(shortUrl); // Will return shorten Url 
            }
        });
    }

console.log(bitly); // Returns undefined 

在我们的测试中,我们发现 console.logging 成功函数内的值每次都会返回缩短的 URL。Console.logging该shortcutUrl函数之外的值每次都返回未定义。

是否有原因我们无法在函数之外获得正确的值?

4

2 回答 2

4

ajax 调用是异步的,这意味着程序不会像您期望的那样逐行运行。ajax 调用之外的 javascript 将继续运行,然后当 ajax 调用在后台完成时,控件将跳回成功/错误回调。

简短的回答:您想对来自 ajax 调用的数据执行的任何操作都必须在该调用的成功处理程序中。

如果出于某种原因,您想在 ajax 调用完成之前停止一切,则将 ajax 传递给 option async: false。这将冻结浏览器,直到 ajax 调用完成。

于 2012-10-18T16:09:22.317 回答
2

使用以下方法设置 ajax 同步:

 $.ajax({
    async:false,
    ...
})
于 2012-10-18T16:09:33.237 回答