Dar*_*rov 11
submit通常,单击按钮后,表单将提交给服务器,并停止所有客户端脚本执行.因此,除非您对表单进行AJAX化,否则它将无效.为了AJAX化您的表单,您可以附加到提交事件并替换默认操作:
$(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;
});
});
和你的标记:
<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>
可能会有所帮助:
$('#submitButtonID').click(function(){
alert('Please wait while form is submitting');
$('#formID').submit();
});
不需要对表格进行Ajaxize。您可以在提交过程中仅显示隐藏的div元素。只要服务器端还没有发送回任何响应，Web浏览器就会一直显示初始页面。
您可以使用CSS display: 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 scriptlets in JSP to 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.