Загрузчик AJAX GIF, в то время как асинхронный запрос POST не работает в IE - PullRequest
0 голосов
/ 23 октября 2009

Я пытаюсь показать gif загрузчика AJAX во время выполнения асинхронного запроса POST. К сожалению, это работает не в Interet Explorer! Gif отображается, но процесс запроса, по-видимому, останавливается соответственно, измененный веб-контент отображаться не будет. На FF, Opera, Safari все отлично! Есть идеи?

http_request.onreadystatechange = function() 
 {
   if (http_request.readyState < 4)
   {
  var waitingPageBody = '< img src="/img/ajaxloader.gif" alt="request in progress..."/>';
  document.body.innerHTML = waitingPageBody;
   }
   else //if (http_request.readyState == 4)
   {
  if (http_request.status == 200)
  {
    document.body.innerHTML = http_request.responseText;

  }//end of if (http_request.status == 200)
  else
  {//other http statuses
    alert("There was a problem");
  }
   } //end of else if http_request.readyState == 4
 }

...

Ответы [ 2 ]

2 голосов
/ 23 октября 2009

Окно будет зависать, потому что запрос является синхронным. Браузер останавливается всякий раз, когда выполняется код JavaScript и синхронный запрос выполняется эквивалентно выполнению кода JavaScript все время, пока браузер ожидает ответа.

1 голос
/ 23 октября 2009

Вы показали нам код обработки события, но звоните open() и send()?

Ваш код обработки событий работает в FF3.5, IE6 и IE8:
http://jsbin.com/ocoka (редактируется через: http://jsbin.com/ocoka/edit)

Полный источник:

<code><!DOCTYPE html>
<html>
<head>
  <title>Sandbox</title>
  <script>
    function load() {
      var http_request = window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
      http_request.open('GET', 'http://jsbin.com/blank.html', true);

      http_request.onreadystatechange = function() {
        if (http_request.readyState < 4) {
          var waitingPageBody = 'request in progress...';
          document.body.innerHTML = waitingPageBody;
        }
        else {
          //if (http_request.readyState == 4)
          if (http_request.status == 200) {
            document.body.innerHTML = '<pre>' + entity(http_request.responseText) + '
'; } // конец if (http_request.status == 200) еще { // другие статусы http alert («возникла проблема»); } } // конец еще, если http_request.readyState == 4 }; http_request.send (); } объект функции (str) { return str.replace (/ & / g, "& amp;"). replace (/ </ g, "& lt;"). replace (/> / g, "& gt;"); };

EDIT:

Согласно вашим комментариям вы делаете синхронный запрос. В этом случае вам вообще не нужно (не нужно?) Использовать обработчик событий, просто запустите свой код до и после вызова send():

Размещенная демоверсия (протестирована в FF3.5, IE6 и IE8):
http://jsbin.com/elehu (редактируется через: http://jsbin.com/elehu/edit)

Полный источник:

<code><!DOCTYPE html>
<html>
<head>
  <title>Sandbox</title>
  <script>
    function load() {
      var http_request = window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
      http_request.open('GET', 'http://jsbin.com/blank.html', false);

      var waitingPageBody = 'request in progress...';
      document.body.innerHTML = waitingPageBody;

      /*** 
        setTimeout with 0ms delay makes sure that the
        'request in progress...' message is displayed
        before the browser thread is blocked by the send() method.
      ***/
      setTimeout(function(){
        http_request.send();
        if (http_request.status == 200) {
          document.body.innerHTML = '<pre>' + entity(http_request.responseText) + '
'; } // конец if (http_request.status == 200) еще { // другие статусы http alert («возникла проблема»); } }, 0); } объект функции (str) { return str.replace (/ & / g, "& amp;"). replace (/ </ g, "& lt;"). replace (/> / g, "& gt;"); }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...