一个简单的jQuery插件ajaxfileupload实现ajax上传文件例子

页面代码:

<html>

<!-- 引入相关的js文件,相对路径 -->

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/ajaxfileupload.js"></script>

<!-- 执行上传文件操作的函数 -->

<script type="text/javascript">

function ajaxFileUpload(){

$.ajaxFileUpload(

{

url:'update.do?method=uploader', //需要链接到服务器地址

secureuri:false,

fileElementId:'houseMaps', //文件选择框的id属性

dataType: 'xml', //服务器返回的格式,可以是json

success: function (data, status) //相当于java中try语句块的用法

{

$('#result').html('添加成功');

},

error: function (data, status, e) //相当于java中catch语句块的用法

{

$('#result').html('添加失败');

}

}

);

}

</script>

</head>

<body>

<form method="post" action="update.do?method=uploader" enctype="multipart/form-data">

<input type="file" />

<input type="button" value="提交" onclick="ajaxFileUpload()"/>

</form>

<div ></div>

</body>

</html>

服务器代码:

public class UpdateAction extends DispatchAction {

public ActionForward uploader(ActionMapping mapping, ActionForm form,

HttpServletRequest request, HttpServletResponse response) {

UpFormForm upFormForm = (UpFormForm) form;

FormFile ff = upFormForm.getHouseMaps();

try {

InputStream is = ff.getInputStream();

File file = new File("D:/" + ff.getFileName()); //指定文件存储的路径和文件名

OutputStream os = new FileOutputStream(file);

byte[] b = new byte[1024];

int len = 0;

while((len = is.read(b)) != -1){

os.write(b, 0, len);

}

os.close();

is.close();

} catch (Exception e) {

e.printStackTrace();

}

return null;

}

}