我正在使用AJAX和jQuery阅读一个大文本文件:
$.ajax({
type: "GET",
url: "testing.txt",
dataType: "text",
success: function (returnText) {
$("#viewDescription").text(returnText);
}
});
然后,我想在请求完成时显示popup animated GIF。我使用以下代码完成了此操作:
$("#popup").on("ajaxSend", function () {
$(this).show();
}).on("ajaxStop", function () {
$(this).hide();
}).on("ajaxError", function () {
$(this).hide();
});
<div style="display: none;" id="popup">
<img src="loading.gif" />
</div>
弹出窗口正确显示和隐藏,但问题是GIF在jQuery AJAX调用运行时停止。它不适用于任何浏览器。请问有什么问题?
答案 0 :(得分:0)
尝试这样的事情:
$('#mybtn').on('click', function(e) {
e.preventDefault();
$("#popup").show(); // Show the loader
$.ajax({
type: "GET",
url: "testing.txt",
dataType: "text",
success: function(returnText) {
$("#popup").hide(); // Hide on success
$("#viewDescription").text(returnText);
},
error: function() {
$("#popup").hide(); // Hide on error
}
});
});
答案 1 :(得分:0)
Try this:
$('#mybtn').on('click', function(e) {
$.ajax({
type: "GET",
url: "testing.txt",
dataType: "text",
beforeSend:function(){
$("#popup").show(); // Show the loader
},
success: function(returnText) {
$("#popup").hide(); // Hide on success
$("#viewDescription").text(returnText);
},
error: function() {
$("#popup").hide(); // Hide on error
}
});
});