Im Moment bekomme ich dieses seltsame Verhalten von IE, wo es nicht meine animierte gif zeigen. Ich versuche, ein ladendes Gif während einer AJAX-Anfrage zu zeigen.
function changeToRecorded(){
$('#entries').fadeOut(200,function(){
$('#main').html('<img id="loadingGif" class="centered" src="./pictures/ajax-loader.gif"; />');
$.get("getData.php",{ status: "R" },requestCompleteRecorded);
});
}changeToRecorded wird aufgerufen, wenn ein Mausklick auf eine bestimmte . Ich bin mir nicht sicher, ob das etwas mit der Verwendung von fadeOut zu tun hat, aber ich sehe nicht, warum das so sein sollte, weil es erst nach der Animation aufgerufen wird. Es liegt nicht an der Art und Weise, wie der Tag geschrieben ist, denn ich habe diesen Tag kopiert und in den Body des HTML-Dokuments eingefügt, und er wird im IE einwandfrei angezeigt.
Wenn jemand eine Ahnung hat, warum das passiert, wäre ich dankbar.
Hinweis: Dies funktioniert bei so gut wie jedem anderen Browser der Welt.
<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>
