在使用ajax的post不工作时显示加载图像
在使用ajax的post不工作时显示加载图像
提问于 2015-09-25 10:32:03
下面是一个div，它包含一个GIF动画：
<div id="busy">
<br />
Loading... Please Wait...
<br />
<img src="Resources/Scripts/loader.gif" alt="" />
</div>下面是一个包含AJAX方法的函数：
function Handler(datas, ele) {
$('#busy').show();
$.ajax({
url: "FileUploadHandler.ashx",
type: "POST",
data: datas,
contentType: false,
processData: false,
success: function () {
ele.width = 100;
$('#busy').hide();
}
});
}如您所见，我在目标div上使用了show并隐藏了它。但这根本没有用，我也不知道问题出在哪里？
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-09-25 10:35:22
您需要设置beforeSend方法，以显示加载进度并在完成时隐藏它。只有在这种情况下，您才能保证在成功/失败时动画将被隐藏。
function Handler(datas, ele) {
$.ajax({
url: "FileUploadHandler.ashx",
type: "POST",
data: datas,
contentType: false,
processData: false,
beforeSend : function() {
$("#busy").show();
},
success: function () {
ele.width = 100;
},
complete: function() {
$("#busy").hide();
}
});
}
function showHide(){
if($('#busy').css("display") == "none"){
$('#busy').show();
} else {
$('#busy').hide();
}
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="busy">
<img src="https://rec.redsara.es/registro/img/loading.gif"/>
</div>
<input type="button" value="click" onclick="showHide()" />
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32788531
复制
相似问题
在Rails3中，可以有一个多部分的form => true和use remote => true吗
remote => true和remote: true之间的差异
Rails3 + link_to(...，:remote => true) + IE 6/7不起作用
用remote=>true阻止Rails link_to吗？
:remote=>true的Rails问题
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
