基于ajax实现文件上传并显示进度条_javascript技巧

在servlet部分：文件上传用的Commons-FileupLoad，需要两个Jar，commons-fileupload和commons-io,少了第二个会报出找不到类的异常；

第一个servlet处理上传，及把上传进度保存到session,第二个servlet处理ajax请求,回传session保存的进度值；

进度条：可以用ajax拿到回传的进度值，改变图片的width实现变化；

jsp代码：

这是index.jsp里的代码：

提交后还在当前页显示进度，所以要用到iframe，提交后的返回放到隐藏的iframe里，不影响页面效果；

css代码：

js代码

flag为上传成功标记，err为出错标记；

servlet代码（UploadServlet）：

不要忘记commons-io包

servlet代码（getProgressServlet）：

效果图如下：

以上就是本文的全部内容，希望对大家有所帮助。