簡單的jQuery AJAX回報

Question

我有這個簡單的腳本：

function paginateUsers(page){ 
    get(_config_remote_host+'/users?page='+page,function(json){ 

     json = JSON.parse(json); 
     var _html = ""; 
     var json_users; 
     var json_num_users; 

     if(json.users){ 
     json_users = json.users; 
     json_num_users = json.number_of_users; 
     } 
     if(!json.users){ 
      json_users = json; 
      json_num_users = 0; 
     } 
     for(i = 0; i < json_users.length; i ++){ 
      if(i == 0){ _html += '<div class="row-fluid separator20">';} 
      _html += '<div class="span3 media userbox">' 
         +'<div class="row-fluid">' 
         + '<div class="span3">' 
         + ' <a class="thumbnail" href="#">' 
         +' <img src="jon.png" alt=""/>' 
         +' </a>' 
         +' </div>' 
         +'<div class="span9">' 
         +' <ul class="unstyled">' 
          +' <li><strong><a href="user.html?id='+json_users[i].id+'">'+json_users[i].first_name+'</strong></br>'+json_users[i].last_name+'</a></li>' 

          +' <li><h6>New york city</h6></li>' 
         +' <li><a class="pull-right btn btn-mini">Contact</a></li>' 
         +' </ul>' 
         +' </div>' 
        +' </div>' 
        +'</div>'; 
       if(i%3 == 2){ _html += '</div><div class="row-fluid separator20">';} 
      } 

     $('.users-list').html(_html).hide().fadeIn(100); 
     //return always total users number to calculate total links number 
     return json_num_users; 
     }); 

    } 

然後我做

var n = paginateUsers(1); 
    alert(n) 

，但它提醒總是 '未定義'，這裏有什麼真正的問題？

這裏Ajax調用和init functs：

function createCORSRequest(_method, _url){ 
    var xhr = new XMLHttpRequest(); 
    if ("withCredentials" in xhr) { 
    // Check if the XMLHttpRequest object has a "withCredentials" property. 
    // "withCredentials" only exists on XMLHTTPRequest2 objects. 
    xhr.open(_method, _url, true); 
    } else if (typeof XDomainRequest != "undefined") { 
    // Otherwise, check if XDomainRequest. 
    // XDomainRequest only exists in IE, and is IE's way of making CORS requests. 
    xhr = new XDomainRequest(); 
    xhr.open(_method, _url); 
    } else { 
    // Otherwise, CORS is not supported by the browser. 
    xhr = null; 
    } 
    return xhr; 
} 

/*END INIT FUNCTION*/ 

function get(_url, _callback){ 
    var xhr = createCORSRequest('GET',_url); 
    if (!xhr){ 
    throw new Error('CORS not supported'); 
    } 
    $('.ajax-loading').show(); 
    xhr.send(); 

    /*SUCCESS -- do somenthing with data*/ 
    xhr.onload = function(){ 
    // process the response. 
    _callback(xhr.responseText); 
    $('.ajax-loading').hide(); 
    }; 

    xhr.onerror = function(e){ 
    console.log(e); 
    $('.ajax-loading').show(); 
    }; 
} 

感謝

Answer 1

你不能從AJAX調用返回，它是異步的。你的回報是在回調函數中，當AJAX調用完成時，回調函數在將來某個時間點運行。 paginateUsers實際上不返回任何內容（這意味着它返回undefined）。

而不是試圖返回任何東西，你應該做所有與回調中的數據相關的操作。或者，更好的是傳遞一個回調函數，並在完成後調用它。

function paginateUsers(page, callback){ 
    get(_config_remote_host+'/users?page='+page,function(json){ 
     // code... 
     if(typeof callback === 'function'){ 
      callback(json_num_users); // Instead of "return json_num_users;" 
     } 
    }); 
} 

然後，你可以這樣做：

paginateUsers(1, function(result){ 
    // result should be the value of json_num_users 
}); 

Answer 2

你是不是從paginateUser返回任何東西，如果返回的get，結果這大概應該是$.get你必須遞延對象（在jquery 1.5之後），它有類似donethen的方法，它接受相應的回調作爲參數

你也可以這樣做

var p = $.get(....) (or $.post or $.ajax etc) 

$.when(p).done(mydone).fail(myfail) 

function mydone(data){ } 
function myfail(err) { } 

編輯：您的編輯我看你實現你自己的Ajax調用，並使用jquery的DOM操作，這是奇怪的

更好只使用$.getJSON方法，它接受URL，返回遞延對象之後，它是更加convinint使用和具有堅實的API

Answer 3

$不用彷徨運行asynchron - 它開始到服務器上，當所有的服務器端處理完成後，將返回一些新的要求。

但是，您的paginateUser（）函數在瀏覽器內部運行，它只是將請求發送到無處/到服務器而不等待結果。