在 jquery 中显示发送结果之前显示加载
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13705945/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
show loading before showing send result in jquery
提问by Alireza
I have a simple jquery code to send a content in a jQuery modal window with ajax! everything is working without any problem. in normal, after clicking on the send button, after 1-2 seconds this code showing the result,
我有一个简单的 jquery 代码，可以使用 ajax 在 jQuery 模式窗口中发送内容！一切正常，没有任何问题。在正常情况下，单击发送按钮后，1-2 秒后此代码显示结果，
function AddFastqpro(action) {
var b = {};
b[dle_p_send] = function () {
var response = $('#dle-poke').val()
$.post(dle_root + 'engine/ajax/fast.php', { text: response, action: action },
function (data) {
if (data == 'ok') {
DLEalert(dle_p_send_ok, dle_info);
}
else { DLEalert(data, dle_info); }
});
};
$('body').append("<div id='dlepopup' style='display:none'><textarea id='dle-poke'></textarea></div>");
$('#dlepopup').dialog({
autoOpen: true,
modal: true,
draggable: false,
width: 350,
dialogClass: "modalfixed",
buttons: b
});
};
My question is, how I can add and show a loading picture after clicking on send and before showing the result?
我的问题是，如何在单击发送后和显示结果之前添加和显示加载图片？
回答by NullPoiиteя
you can do this by ajaxStart()and ajaxComplete()
你可以通过 ajaxStart()和 ajaxComplete()
$("#loading").ajaxStart(function(){
$(this).show();
});
$("#loading").ajaxComplete(function(){
$(this).hide();
});
or
或者
$.ajax({
url : dle_root + 'engine/ajax/fast.php',
data: { text: response, action: action },
beforeSend: function(){
$("#loading").show();
},
complete: function(){
$("#loading").hide();
},
success: function (data) {
if (data == 'ok') {
DLEalert(dle_p_send_ok, dle_info);
}
else { DLEalert(data, dle_info); }
});
});
回答by Laz Karimov
$('#button').click(function(){
$('#loading-div').html('<img src="..." />');
$.ajax({
type: 'POST',
url: '...',
data: {...},
success: function(response) {
$('#loading-div').html('');
}
});
});
In case if you have button with id="button", and some <div id="loading-div"></div>in which you can display image
如果您有带有 的按钮id="button"，以及一些<div id="loading-div"></div>可以显示图像的按钮
回答by Matanya
you can use $.ajax()instead of $.post(), and add a beforeSendfunction
您可以使用$.ajax()代替$.post()，并添加一个beforeSend函数
