jsp

最新推荐文章于 2022-05-19 23:47:25 发布

iteye_16435

最新推荐文章于 2022-05-19 23:47:25 发布

阅读量92

点赞数

文章标签： JSP Ajax XML HTML

本文链接：https://blog.csdn.net/iteye_16435/article/details/81962190

版权

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<title>Ajax Process Bar</title>

<script type="text/javascript" src="jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
// 等待DOM加载
function showProgressBar() {
document.getElementById("sendButton").disabled=true;
document.getElementById("progressBar").style.visibility="visible";
}
$(document).ready(function() {
// 绑定"#myForm"，然后加入回调函数
var options = {
dataType: 'xml' ,
success: function(responseXML) {
document.getElementById("progressBar").style.visibility="hidden";
document.getElementById("sendButton").disabled=false;
var message = $('message', responseXML).text();
alert(message);
}
};
$('#myForm').ajaxForm(options);

});
</script>
<head>
<body>

<form id="myForm" action="upload.do" method="post" enctype="multipart/form-data" οnsubmit="showProgressBar();">
学生编码：<input type="text" name="code" value="001"><br>
学生姓名：<input type="text" name="name" value="zhangsan"><br>
附件1：<input type="file" name="file1" id="file1"><br>
附件2：<input type="file" name="file2" id="file2"><br>

<div id="progressBar"
style = visibility:hidden>
<img src="progress_bar.gif"/><font>正在上传，请等待......</font>
</div>

<input type="submit" value="提交" id="sendButton" >
<input type="reset">

</form>

<body>
</html>