2010-10-11 3 views
1

Как я могу сделать следующее с помощью jQuery?Асинхронный запрос AJAX с jQuery

var xmlhttp; 

if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp = new XMLHttpRequest(); 
} 
else {// code for IE6, IE5 
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     document.getElementByID('statusDisplay').innerHTML = xmlhttp.responseText; // show loaded content 
    } else if (xmlhttp.readyState >= 1 && xmlhttp.status == 200) /* if(xmlhttp.readyState>=2 && xmlhttp.status==200) */ { 
     document.getElementByID('statusDisplay').innerHTML = '<img src="ajax_load.gif" />'; // show ajax loading image 
    } 
} 
xmlhttp.open("GET", "path/to/file.php", true); 
xmlhttp.send(); 

То, что я в основном заинтересованы в том, как я могу извлечь readyStatea и статус, и как я могу получить текст ответа внутри этих функций (более или менее, как это):

$.ajax({url: 'path/to/file.php', async: true, success: function(){ 
    // how can I get the responseText here? 
}, whileLoading: function(){ 
    // does such a parameter actually exist? 
}}); 

Спасибо заранее!

ответ

2

jQuery не поддерживает «родной» (jQuery'ish) доступ к readyStates.

Обратный вызов interactive, например, который может представлять readyState===3.

Во всяком случае, у вас есть доступ к responseText в success callback от .ajax()

$.ajax({ 
    url:  'some.pl', 
    dataType: 'text', 
    type:  'GET', 
    success: function(data){ 
     // data represents xhr.responseText here 
    } 
}); 

Во всяком случае, метод .ajax() возвращает XMLHttpRequest, который вы можете получить доступ в случае необходимости.

var myxhr = $.ajax({}); 
myxhr._onreadystatechange = myxhr.onreadystatechange; 

myxhr.onreadystatechange = function(){ 
    myxhr._onreadystatechange(); 
    if(myxhr.readyState === 3) {} // or whatever 
}; 

Это возможное обходное решение этой проблемы. Но в целом у вас будут все данные и информация, которые вам нужны в ajax event callbacks.
Кроме того, XMLHttpRequest object перешел во многие обратные вызовы, такие как beforeSend, error и success.

Для получения дополнительной информации см. http://api.jquery.com/jQuery.ajax/.

+0

Отлично, спасибо! Однако есть ли возможность доступа к ReadyState извне, например. г. путем сохранения $ .ajax (...) в переменную ..? – arik

+0

@ arik-so: да, действительно, я обновил свой ответ. – jAndy

+0

Отлично, спасибо большое! – arik

2

Чтобы ответить на ваш первый вопрос, функция успеха обратного вызова принимает несколько параметров, один из них возвращаемых данных, так:

$.ajax({url: 'path/to/file.php', async: true, success: function(data){ 
    // data 
}, whileLoading: function(){ 
    // there is no whileLoading callback function 
}}); 

Чтобы ответить на ваш второй вопрос, нет такой функции обратного вызова whileLoading. Обратитесь к документации для получения дополнительной информации: http://api.jquery.com/jQuery.ajax/

0

$.ajax() возвращает XmlHttpRequest он генерирует, так что вы можете получить доступ к нему таким образом, например:

var xhr = $.ajax({url: 'path/to/file.php', async: true, success: function(data){ 
    // use data here for the response 
}}); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState == 4 && xhr.status == 200) { 
    $('#statusDisplay').html(xhr.responseText); 
    } else if (xhr.readyState >= 1 && xhr.status == 200) { 
    $('#statusDisplay').html('<img src="ajax_load.gif" />'); 
    } 
}; 

То, что вы, вероятно, хотите является beforeSend и data (кулак параметр) в success, как это:

$.ajax({ 
    url: 'path/to/file.php', 
    beforeSend: function() { 
    $('#statusDisplay').html('<img src="ajax_load.gif" />'); 
    }, 
    success: function(data) { 
    $('#statusDisplay').html(data); 
    } 
}); 
+0

@Marko - Да, около 3 минут назад :) –

+0

Слава богу за разные часовые пояса. Пока они не обновят вас до «робота без сна». – Marko

0

по JQuery 1.5, $.ajax() возвращает jqXHR object.

Это означает, что:

Никакой механизм onreadystatechange не при условии, однако, так как успех, ошибки, полный и StatusCode покрытия всех мыслимых требований

и решение JANDY своей воле более работы ,

Я не знаю, как получить доступ к объекту XMLHttpRequest из jqXHR. Поэтому, если вы хотите реагировать на изменения в ходе запроса и используете jQuery 1.5, похоже, что вам лучше полагаться на методы jqXHR.

Смежные вопросы