我正在尝试在我的jQuery.ajax()请求中进行显示/隐藏加载,但我有一个问题。当我多次进行ajax调用时,加载图像不会显示。 我尝试了所有的事情但没有任何作用最后我尝试使用setTimeout设置一个睡眠定时器然后稍微工作,图像显示但是当调用ajax调用时,image.gif不起作用,动画停止。 我正在使用Bootstrap 3.0.0和jQuery 2.1.1
html ...
<a href="#" id="Today" class="navbar-link">Today</a>
<div id="myLoading" class="mydiv" hidden="hidden">
<img src="~/Content/Images/ajax-loader.gif" class="ajax-loader" />
</div>
jquery代码......
jQuery('#Today').click(function () {
jQuery('#myLoading').show();
var request = jQuery.ajax({
url: '/Home/Today',
type: 'get',
dataType: 'html'
});
request.done(function (html, status, jqXHR) {
jQuery('#tableSection').html(html);
});
request.fail(function (jqXHR, status, errorThrow) {
alert("There was a error: " + errorThrow + ", the estatus is: " + status);
});
request.always(function () {
jQuery('#myLoading').hide();
});
});
css ......
.mydiv {
height: 400px;
width: 700px;
position: absolute;
left: 20%;
top: 25%;
}
.ajax-loader {
position: absolute;
left: 50%;
top: 50%;
margin-left: -32px;
margin-top: -32px;
display: block;
}
...谢谢