Javascript jQuery .submit() 成功或失败触发器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8089679/
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
jQuery .submit() success or failure trigger
提问by stewart715
I am using .submit()to submit my form over ajax periodically, but I want the user to see that the form is being saved with a spinning wheel and then 'Saved!' upon success. Is there a successtrigger for .submit()in jQuery?
我使用.submit()定期通过 ajax 提交我的表单，但我希望用户看到表单正在使用旋转轮保存，然后“已保存！” 成功后。jQuery 中有success触发器.submit()吗？
Thanks!
谢谢！
采纳答案by Blender
You can use a manual $.post()request instead of a .submit(). The $.post()has a success callback.
您可以使用手动$.post()请求而不是.submit(). 该$.post()有一个成功回调。
You'll have to fill in the details of the $.post()(the target URL) and .serialize()your form's elements.
您必须填写$.post()（目标 URL）和.serialize()表单元素的详细信息。
回答by Idham Perdameian
Try this:
尝试这个：
jQuery:
jQuery：
$(document).ready(function() {
$('#form').submit(function() {
var status = '<img class="loading" src="loading_detail.gif" alt="Loading..." />';
$("#ajax").after(status);
$.ajax({
type: 'POST',
url: $(this).attr('action'),
data: $(this).serialize(),
dataType: 'json',
success: function(json) {
if(json.type == 'success') {
$('#msg').css("color","green").html(json.message);
} else if(json.type == 'warning'){
$('#msg').css("color","yellow").html(json.message);
} else if(json.type == 'error'){
$('#msg').css("color","red").html(json.message);
}
$('.loading').remove();
}
})
return false;
});
});
Html:
网址：
<div id="msg"></div>
<form id="form" method="post" action="action.php" >
<input type="text" name="email" />
<input type="submit" name="submit" value="submit" /><span id="ajax"></span>
</form>
action.php :
动作.php :
<?php
if(isset($_POST['email'])){
$val = $_POST['email'];
switch ($val) {
case '[email protected]':
$return = array('type'=>'success', 'message'=>'This is success message!'); break;
case 'email':
$return = array('type'=>'warning', 'message'=>'This is warning message!'); break;
default:
$return = array('type'=>'error', 'message'=>'This is error message!');
}
echo json_encode($return);
}
?>
Note:If you are submitting the form programmatically you need to call $('#form').submit()once again but this time without arguments so that you trigger the submit event.
注意：如果您以编程方式提交表单，则需要$('#form').submit()再次调用，但这次没有参数，以便触发提交事件。
回答by Menni
To show a spinning wheel while submitting a page, try to get a animated GIF (there are much free loading circles). This GIF implement in your page with:
要在提交页面时显示旋转轮，请尝试获取动画 GIF（有很多免费加载圆圈）。这个 GIF 在您的页面中实现：
class="myloadingcircle" style="display:none"
and then use jQuery:
然后使用jQuery：
$("form").submit(function(e) { $(".myloadingcircle").show(); });
