异步文件下传的两种方式
异步文件上传的两种方式
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>文件管理</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<script type="text/javascript" src="<%=path %>/script/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="<%=path %>/script/jquery.form.js"></script>
<script type="text/javascript">
function uploadFile()
{
var url = "<%=path %>/file/uploadFileWithMultipartFiles.htm";
var fm = document.getElementById("fm");
fm.action = url;
fm.enctype = "multipart/form-data";
fm.target = "queryDown";
fm.method = "GET";
fm.submit();
}
function jqFormUploadFile()
{
$("#fm").form('submit',{url:"<%=path %>/file/uploadFileWithMultipartFiles.htm",
success:function(data)
{
$("#downfile_div").html(data);
}
});
}
$(function(){
$("#downfile_div").load("<%=path%>/file/showFiles.htm");
});
</script>
</head>
<body>
<div style="width: 100%;">
<center>
<table width="80%" border="1">
<tr>
<td width="50%" align="center">文件上传</td>
<td width="50%" align="center">文件下载</td>
</tr>
<tr>
<td align="center">
<form id="fm" action="" method="post" enctype="multipart/form-data">
<table>
<tr><td>
<input type="file" name="upfiles">
</td></tr>
<tr><td>
<input type="file" name="upfiles">
</td></tr>
<tr><td align="center">
<input type="button" value="开始上传" onclick="jqFormUploadFile()" />
</td></tr>
</table>
</form>
</td>
<td align="center">
<div id="downfile_div">
</div>
</td>
</tr>
</table>
</center>
</div>
<iframe src="" name="queryDown" id="queryDown" style="display: none"></iframe>
</body>
</html>