/**
* 本例程演示了通过Web上传文件过程中的进度显示。您可以对本例程进行任何修改和使用。
* 如果需要转载本例程,请您注明作者。
*
* 作者: 刘作晨
* EMail:liuzuochen@gmail.com
*/
package liuzuochen.sample.upload;
/**
* Title: 类控制器
*
* Description: 主要作用是对FileUploadStatus进行管理,为客户端提供相应的
* FileUploadStatus类对象。这是一个单例类。
*
*/
import java.util.Vector;
public class BeanControler {
private static BeanControler beanControler = new BeanControler();
private Vector vector = new Vector();
private BeanControler() {
}
public static BeanControler getInstance() {
return beanControler;
}
/**
* 取得相应FileUploadStatus类对象的存储位置
*/
private int indexOf(String strID) {
int nReturn = -1;
for (int i = 0; i < vector.size(); i++) {
FileUploadStatus status = (FileUploadStatus) vector.elementAt(i);
if (status.getUploadAddr().equals(strID)) {
nReturn = i;
break;
}
}
return nReturn;
}
/**
* 取得相应FileUploadStatus类对象
*/
public FileUploadStatus getUploadStatus(String strID) {
return (FileUploadStatus) vector.elementAt(indexOf(strID));
}
/**
* 存储FileUploadStatus类对象
*/
public void setUploadStatus(FileUploadStatus status) {
int nIndex = indexOf(status.getUploadAddr());
if ( -1 == nIndex) {
vector.add(status);
} else {
vector.insertElementAt(status, nIndex);
vector.removeElementAt(nIndex + 1);
}
}
/**
* 删除FileUploadStatus类对象
*/
public void removeUploadStatus(String strID){
int nIndex = indexOf(strID);
if(-1!=nIndex)
vector.removeElementAt(nIndex);
}
}
2.2. 客户端代码
客户端我们采用Prototype框架。请下载。
2.2.1. AjaxWrapper.js
AjaxWrapper.js对Prototype进行了封装。请下载分析
2.2.2. fileUpload.html
fileUpload.html是文件上传界面。 请下载。
2.2.3. result.jsp
result.jsp是文件上传结果显示界面。 请下载
2.2.4. fileUpload.css
fileUpload.css是样式文件。 源代码如下:
body {
color:#000;
background-color:white;
font:15px Georgia, "Lucida Grande", Arial, sans-serif;
letter-spacing:0.01em;
margin:15px;
}
#controlPanel,#resultPanel{
width:700px;
margin:20px auto;
padding:25px;
border:3px solid gray;
-moz-border-radius:10px;
background:#f8f8f8;
}
#errorArea{
width:400px;
margin:20px auto;
padding:25px;
border:3px solid gray;
-moz-border-radius:10px;
background:red;
}
#normalMessageArea{
width:400px;
margin:20px auto;
padding:25px;
border:3px solid gray;
-moz-border-radius:10px;
background:yellow;
}
#progressBar { padding-top: 5px; }
#totalProgressBarBox {
width: 350px;
height: 20px;
border: 1px inset;
background: #eee;
}
#totalProgressBarBoxContent {
width: 0;
height: 20px;
border-right: 1px solid #444;
background: #9ACB34;
}
2.3. 配置文件
web.xml中完成Servlet的配置。
<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<display-name>AjaxPractice</display-name>
<servlet>
<description></description>
<display-name>BackGroundService</display-name>
<servlet-name>BackGroundService</servlet-name>
<servlet-class>liuzuochen.sample.upload.BackGroundService</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>BackGroundService</servlet-name>
<url-pattern>*.action</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>
3. 结语
整个程序到这里就介绍完了,希望它多少能为您的工作或学习带来点儿帮助。