如何同时运行这些功能?

时间:2014-05-19 18:30:56

标签: javascript jquery

我正致力于构建一些自定义社交分享图标。我使用以下请求来获取每个网络的份额,推文等数量。在运行"激活所有其他功能"之前的功能之前,我需要完成所有这些请求。部分。通过以我拥有的方式嵌套它们,它迫使它们一次运行一个。有没有办法可以处理这些,以便它们全部同时运行,以便底部的功能在它们全部完成之前不会运行?

function getShares($URL) {

// Get the Twitter Share Count
 jQuery.getJSON('http://cdn.api.twitter.com/1/urls/count.json?url=' + $URL + '&callback=?', function (twitdata) {
    jQuery('.twitter .count').text(ReplaceNumberWithCommas(twitdata.count));
    // Get the LinkedIn Count
    jQuery.getJSON('http://www.linkedin.com/countserv/count/share?url=' + $URL + '&callback=?', function (linkdindata) {
        jQuery('.linkedIn .count').text(ReplaceNumberWithCommas(linkdindata.count));
        // Get Facebook Shares
        jQuery.getJSON('http://graph.facebook.com/?id=' + $URL + '&callback=?', function (facebook) {
            jQuery('.fb .count').text(ReplaceNumberWithCommas(facebook.shares));                
            // Get Pinterest Pins
            jQuery.getJSON('http://api.pinterest.com/v1/urls/count.json?url=' + $URL + '&callback=?', function (pins) {
                jQuery('.nc_pinterest .count').text(ReplaceNumberWithCommas(pins.count));               
                // Get Pinterest Pins
                jQuery.getJSON('http://api.pinterest.com/v1/urls/count.json?url=' + $URL + '&callback=?', function (pins) {
                    jQuery('.nc_pinterest .count').text(ReplaceNumberWithCommas(pins.count));               

                    // Activate All Other Functions
                    createFloatBar();
                    setWidths();
                    floatingBar();
                    activateHoverStates();
                });
            });
        });
    });
});

}

2 个答案:

答案 0 :(得分:4)

是将所有内容包装在

$.when()

您希望同时运行,当它们全部完成时,此$.then()将执行

$.when( 
    // code to run,
    // code to run ,
    //code to run,
 ).then(function(){

    // runs when everything in top block is finished
});

你可以使用Google jQuery Deferred Execution或jQuery promise

答案 1 :(得分:0)

另一个选项是async.js库。它的另一个好处是允许您将结果放入最终函数可以使用的对象中。

https://github.com/caolan/async

文档中的示例:

// an example using an object instead of an array
async.parallel({
    one: function(callback){
        setTimeout(function(){
            callback(null, 1);
        }, 200);
    },
    two: function(callback){
        setTimeout(function(){
            callback(null, 2);
        }, 100);
    }
},
function(err, results) {
    // results is now equals to: {one: 1, two: 2}
});

要与您的代码一起使用,您只需将getJSON来电代替setTimeout来电,将callback功能置于其中并将结果传入其中。