Javascript 在IE中使用jquery显示gif_Javascript_Jquery_Html_Internet Explorer

Javascript 在IE中使用jquery显示gif

javascript jquery html internet-explorer

Javascript 在IE中使用jquery显示gif,javascript,jquery,html,internet-explorer,Javascript,Jquery,Html,Internet Explorer,现在我从IE那里得到了这种奇怪的行为，它没有显示我的动画gif。我试图在AJAX请求期间显示正在加载的gif function changeToRecorded(){ $('#entries').fadeOut(200,function(){ $('#main').html('<img id="loadingGif" class="centered" src="./pictures/ajax-loader.gif"; />'); $.get("getData.ph

现在我从IE那里得到了这种奇怪的行为，它没有显示我的动画gif。我试图在AJAX请求期间显示正在加载的gif

function changeToRecorded(){
  $('#entries').fadeOut(200,function(){
    $('#main').html('<img id="loadingGif" class="centered" src="./pictures/ajax-loader.gif"; />');
    $.get("getData.php",{ status: "R" },requestCompleteRecorded);
  });
}

函数更改记录（）{
$（“#条目”）.fadeOut（200，function（）{
$（'#main'）.html（''）；
$.get（“getData.php”，{status:“R”}，requestCompleteRecorded）；
});
}

在鼠标单击特定对象时调用changeToRecorded。在此期间（在IE中），加载的gif在中根本不显示。我不确定是否与使用淡出有关，但我不明白为什么会这样，因为它在动画之后才被调用。这不是标记的编写方式，因为我已经将该标记复制并粘贴到HTML文档的主体中，并且它在IE中显示得非常好

如果有人知道为什么会发生这种情况，我将不胜感激

注意：这适用于世界上几乎所有其他浏览器

<html>
<head>
  <link rel="stylesheet" href="themeSuggestion.css">
  <script type="text/javascript" src="jQuery/jquery.js"></script>
  <script type="text/javascript">
    $(document).ready(onDocumentReady);

    function onDocumentReady(){
      $('#Recorded').addClass('border').click(changeToRecorded);
      $('#Pending').addClass('border').click(changeToPending);
      $('#main').addClass('scroll');
      $('#entries').addClass('main');
      $('#loadingGif').hide();
    }

    function changeToRecorded(){
      /*
      $('#entries').fadeOut(30,function(){
        $('#loadingGif').show();
        $.get("getData.php",{ status: "R" },requestCompleteRecorded);
      });
      */

      $('#entries').html('');
      $('#loadingGif').show();
      $.get("getData.php",{ status: "R" },requestCompleteRecorded);
    }

    function changeToPending(){
     /*
     $('#entries').fadeOut(30,function(){
        $('#loadingGif').show();
        $.get("getData.php",{ status: "P" },requestCompletePending);
      });
      */
      $('#entries').html('');
      $('#loadingGif').show();
      $.get("getData.php",{ status: "P" },requestCompletePending);
    }

    function requestCompletePending(data){
      $('#loadingGif').hide();
      $('#entries').addClass('main');
      $('#entries').html(data).fadeIn();
      $('#theme').addClass('fixws');
      $('#date').addClass('fixws');
    }

    function requestCompleteRecorded(data){
      $('#loadingGif').hide();
      $('#entries').addClass('main');
      $('#entries').html(data).fadeIn();
    }

  </script>
</head>

<body>
<div id="Recorded">Recorded</div><div id="Pending">Pending</div>
<br/><br/>
<div id="main">
  <img id="loadingGif" class="centered" src="./pictures/ajax-loader.gif"; />
  <table id="entries"></table>
</div>
</body>
</html>


$（文档）.ready（onDocumentReady）；
函数onDocumentReady（）{
$（“#录制”）。添加类（“边框”）。单击（更改录制）；
$（“#挂起”）.addClass（“边框”）。单击（changeToPending）；
$（'#main'）.addClass（'scroll'）；
$（'#entries'）.addClass（'main'）；
$（'#loadingGif'）.hide（）；
}
函数更改记录（）{
/*
$（“#条目”）.fadeOut（30，function（）{
$（'#loadingGif'）.show（）；
$.get（“getData.php”，{status:“R”}，requestCompleteRecorded）；
});
*/
$（“#条目”）.html（“”）；
$（'#loadingGif'）.show（）；
$.get（“getData.php”，{status:“R”}，requestCompleteRecorded）；
}
函数changeToPending（）{
/*
$（“#条目”）.fadeOut（30，function（）{
$（'#loadingGif'）.show（）；
$.get（“getData.php”，{status:“P”}，requestCompletePending）；
});
*/
$（“#条目”）.html（“”）；
$（'#loadingGif'）.show（）；
$.get（“getData.php”，{status:“P”}，requestCompletePending）；
}
函数请求完成结束（数据）{
$（'#loadingGif'）.hide（）；
$（'#entries'）.addClass（'main'）；
$（'#entries'）.html（data.fadeIn（）；
$（'#theme'）.addClass（'fixws'）；
$（'#date'）.addClass（'fixws'）；
}
功能请求完成记录（数据）{
$（'#loadingGif'）.hide（）；
$（'#entries'）.addClass（'main'）；
$（'#entries'）.html（data.fadeIn（）；
}
记录待定

这可能是因为您处理问题的方式。您正在使用淡出方法的回调函数插入一些html。问题是，在服务器完成向客户机提供页面之前，不会插入该页面。您可以插入图像标签，但IE不会加载该图像，因为它不知道需要从服务器获取该图像

更好的方法是将gif放入标记中。使用一些css来隐藏它，然后使用jquery fadeIn（）方法在需要时显示它，使用fadeOut（）方法在需要时隐藏它。

我做了您建议的更改，因此IE第一次显示gif，但在我尝试再次显示后，它不再显示。在我看来，IE正在缓存我的表，因为在第一次AJAX请求之后没有延迟，所以它工作正常，但IE正在缓存getData.php的结果，这样它就不会实际重新加载表中的内容，你永远看不到加载的gif。您可以尝试通过生成一个随机字符串并将其固定到querystring的末尾来防止缓存，因此它看起来像：$.get（'getData.php？=ab983dj'），好的，当我使用随机字符串生成器进行get请求时，我终于让它工作了。我想唯一的一点是，它连续两次保持相同的可能性非常小。非常感谢您的帮助！这都是因为ie…每个人的问题的根源。