Gán biến từ jquery ajax gọi trả về không xác định

Question

Tôi mới dùng jquery và tôi đang cố gắng gán một giá trị cho một biến sau một cuộc gọi ajax nhưng nó trả về không xác định. Mã của tôi bên dưới:

function prepareDocument() { 
var a = getAverageRating(1); 
alert(a); 
} 
function getAverageRating(pageId) { 
$.ajax({ 
    url: "../services/rating.ashx?action=getAverageRating&pageId=" + pageId, 
    dataType: "text", 
    type: "GET", 
    data: {}, 
    error: function (err) { 
     displayDialogBox("Error", err.toString()); 
    }, 
    success: function (data) { 
     return data; 
    } 
}); 
} 

Mọi trợ giúp sẽ được đánh giá cao. Cảm ơn,

Answer 1

Đây là vấn đề rất phổ biến đối với những người không quen sử dụng các hoạt động không đồng bộ. Nó đòi hỏi bạn phải suy nghĩ lại cách bạn cấu trúc mã của bạn bởi vì bạn không thể chỉ lập trình theo kiểu tuần tự bình thường.

Bạn không thể trả về giá trị từ trình xử lý thành công của cuộc gọi ajax không đồng bộ. Các ajax cll từ lâu đã hoàn thành và đã trở lại. Trả về một giá trị từ trình xử lý thành công chỉ cần đi vào ruột của mã ajax, chứ không phải trở lại mã của bạn.

Thay vào đó, bạn phải sử dụng kết quả của cuộc gọi ajax trong trình xử lý thành công hoặc trong một hàm bạn gọi từ trình xử lý thành công.

Trong trường hợp cụ thể của bạn, chức năng getAverageRating() của bạn có thể cần phải thực hiện chức năng gọi lại và khi xếp hạng được truy xuất, chức năng gọi lại sẽ được gọi. Nó không thể trả về giá trị vì nó trả về ngay lập tức và sau đó một thời gian trong tương lai, cuộc gọi ajax hoàn thành và trình xử lý thành công trong hàm ajax được gọi với dữ liệu thực tế.

function prepareDocument() { 
    getAverageRating(1, function(data) { 
     alert(data); 
    }); 
} 

function getAverageRating(pageId, fn) { 

    $.ajax({ 
     url: "../services/rating.ashx?action=getAverageRating&pageId=" + pageId, 
     dataType: "text", 
     type: "GET", 
     data: {}, 
     error: function (err) { 
      displayDialogBox("Error", err.toString()); 
     }, 
     success: function (data) { 
      fn(data); 
     } 
    }); 

}