从 jQuery.get 嵌套函数中获取 var答案

【问题标题】：Get var out of jQuery.get nested function从 jQuery.get 嵌套函数中获取 var
【发布时间】：2011-06-08 19:01:43
【问题描述】：

  function getUserHours(tyPe, tarGet){
    $.get('/activities/search', { 'type': tyPe }, 
    function(data){   
     var hourResultData = jQuery.parseJSON(data);
     var registeredHours = 0; 
     for (var i in hourResultData.activities){
      registeredHours += parseFloat(hourResultData.activities[i].hours);
     }
     $(tarGet).empty().append(registeredHours);
     return registeredHours;
   });

  }

我想要：

alert( getUserHours('r', '#reg-hours'));

提醒已注册的时间

【问题讨论】：

标签： javascript jquery ajax return

【解决方案1】：

当数据准备好时调用您尝试返回的回调函数，这意味着数据是异步发送的。

这意味着您不能直接从您的getUserHours 函数返回数据。当数据准备好时，您需要一个回调函数来触发。

类似这样的：

  function getUserHours(tyPe, tarGet, callback){
    $.get('/activities/search', { 'type': tyPe }, 
    function(data){   
     var hourResultData = jQuery.parseJSON(data);
     var registeredHours = 0; 
     for (var i in hourResultData.activities){
      registeredHours += parseFloat(hourResultData.activities[i].hours);
     }
     $(tarGet).empty().append(registeredHours);

     callback(registeredHours); // callback, send back data to callback function
   });

  }

然后在getUserHours中发送一个匿名函数作为参数。

  getUserHours('r', '#reg-hours', function(data) {
    alert(data);
  });

【讨论】：

【解决方案2】：

只有关闭 AJAX 的异步 GET 才能直接返回数据：

$.ajax({
    type: 'GET',
    url: '/activities/search',
    data: { 'type': tyPe },
    async : false,
    success : function() { }
 });

不建议这样做，因为浏览器会一直阻塞直到您的请求完成。相反，您应该通过使用函数回调继续遵循异步编程模型：

$.ajax({
    type: 'GET',
    url: '/activities/search',
    data: { 'type': tyPe },
    async : false,
    success : function() { }
 });

function getUserHours(tyPe, tarGet, callback)
{
    $.get('/activities/search', { 'type': tyPe }, 
    function(data)
    {
        var hourResultData = jQuery.parseJSON(data);
        var registeredHours = 0; 
        for (var i in hourResultData.activities){
            registeredHours += parseFloat(hourResultData.activities[i].hours);
        }
        $(tarGet).empty().append(registeredHours);
        if($.isFunction(callback))
            callback(registeredHours);
    });
}

getUserHours('r', '#reg-hours', function(hours) {
    alert(hours);
});

【讨论】：

jQuery 1.5 将使用新的 Deffered 和 promise 方法添加一些额外的方法。
听起来很有趣，必须研究一下。