jQuery 单击提交按钮后如何显示jquery消息
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3377468/
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
How to show jquery message after clicking on submit button
提问by maas
I am new to jquery and would like to learn how to show a message (e.x please wait in green color or submitting ) after clicking on the submit button.
我是 jquery 的新手，想学习如何在单击提交按钮后显示消息（例如，请以绿色等待或提交）。
Can you please help
你能帮忙吗
回答by Darin Dimitrov
After you click on a submitbutton usually the form is submitted to the server and all client script execution stops. So unless you AJAXify your form it won't work. In order to AJAXify your form you could attach to the submitevent and replace the default action:
单击submit按钮后，通常会将表单提交到服务器，并且所有客户端脚本的执行都会停止。所以除非你 AJAXify 你的表单它不会工作。为了 AJAXify 您的表单，您可以附加到提交事件并替换默认操作：
$(function() {
$('#theForm').submit(function() {
// show a hidden div to indicate progression
$('#someHiddenDiv').show();
// kick off AJAX
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function() {
// AJAX request finished, handle the results and hide progress
$('#someHiddenDiv').hide();
}
});
return false;
});
});
and your markup:
和你的标记：
<form id="theForm" action="/foo" method="post">
<input name="foo" type="text" />
<input type="submit" value="Go" />
</form>
<div id="someHiddenDiv" style="display: none;">Working...</div>
回答by sTodorov
May be this will help:
可能这会有所帮助：
$('#submitButtonID').click(function(){
alert('Please wait while form is submitting');
$('#formID').submit();
});
回答by BalusC
Ajaxifying the form is not needed. You can just show a hidden div element during submit. As long as the server side hasn't sent any bit of the response back, the webbrowser will keep displaying the initial page.
不需要 Ajaxifying 表单。您可以在提交期间显示隐藏的 div 元素。只要服务器端没有发回任何响应，网络浏览器就会继续显示初始页面。
You can use CSS display: noneto initially hide an element. You can use jQuery.show()to show the element(s) matching the selector.
您可以使用 CSSdisplay: none来最初隐藏元素。您可以使用jQuery.show()来显示与选择器匹配的元素。
<!DOCTYPE html>
<html lang="en">
<head>
<title>SO question 3377468</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
$('#form').submit(function() {
$('#progress').show();
});
});
</script>
<style>
#progress {
display: none;
color: green;
}
</style>
</head>
<body>
<form id="form" action="servlet-url" method="post">
...
<input type="submit">
</form>
<div id="progress">Please wait...</div>
</body>
</html>
So, as long as you are not using scriptletsin JSPto run heavy business stuff, but rather a servlet class which in turn displays the JSP at end of the processing, it'll work as you expect.
因此，只要您不是在 JSP 中使用scriptlet来运行繁重的业务，而是使用 servlet 类在处理结束时依次显示 JSP，它就会按您的预期工作。
