首先说流程: 1.访问启动任务servlet 2.启动任务servlet开启任务,并跳转掉进度条展示页面 3.页面就绪就调用(进度参数获取servlet),此后进度条展示页面定时调用,直到传递过来为100%. 4.获取参数servlet从session中取出任务,并获取任务中的进度参数.返回进度参数给进度展示页面.
一下是各个文件代码,工程为web工程。
1.进度条schedule.css文件:
body { margin:0; padding:0; font-family:"宋体"; font-size:12px; line-height:1.8em; color:#392b60; height:100%; }/*最外层的div样式*/.progressOutside { border:red 1px dotted; /*边框1像素的红色虚线*/ width:350px; /*宽度是350像素*/ position:relative; /*相对body位置*/ margin-left:-175px; /*整个div宽度是350,-175px就是向右移动了175像素.正好居中.*/ left:50%; /*左边框距浏览器左边框是屏幕的一半.*/ margin-top:150px; /*上边框相对于body顶部35%*/}/*标题div样式*/.progressTitle { border:greenyellow 1px solid; line-height:30px; /*设置行高 padding:0 15px 0; /*内填充 上:0, 右:15像素, 下:0*/}/*内容div样式*/.progressContent { border:purple 1px double; padding:15px; height:40px !important;}/*进度条框*/.progress { background:#f0f4f9 url(../imgs/2.gif) repeat-x top; border:yellow 2px solid; height:15px; margin:10px 0 0 0 !important; margin:35px 0 0 0;}/*进度条实体*/.progressSchedule { border:red 1px double; background:url(../imgs/1.gif) repeat-x left top; width:3%; height:15px;}/*进度提示框*/.progressPercent { text-align:center; border:green 1px solid; height:15px; position:absolute; display:block; left:125px; margin-top:-17px; width:100px;}/*百分比提示框*/.textProgress { border:orange 1px solid; font-weight:bold; font-family:tohama;}
2.页面文件invoke.jsp 用到了jquery.
<%=basePath%>css/schedule.css" rel="stylesheet" type="text/css">
3.用到的ajax get.js文件
$(document).ready(function(){getPercent();});function getPercent(){ $.post("process",{userName:'ab'},function(data){ styleId.style.width=data; $("#bfb").text(data); if(data!='100%'){ window.setTimeout(getPercent,100); }else{ if(confirm("Finished?")){ window.location.href="/servlet1/index.html"; } } });}
4.启动线程servlet Index.java
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { Progress p = (Progress) request.getSession().getAttribute("progress"); if(p!=null){ System.out.println("Thread Running!"); throw new RuntimeException("线程被占用!"); }else{ Progress progress = new Progress(); request.getSession().setAttribute("progress", progress); progress.start(); } response.sendRedirect(request.getContextPath()+"/invoke.jsp");}
5.线程任务类-->要做的任务写在这个里面Progress.java
public class Progress extends Thread{ Logger logger = Logger.getLogger(Process.class); //Getter方法省略 private String percent = ""; //Getter方法省略 private boolean over = false; public void run(){ for(int i=1;i<=100;i++){ try { Thread.sleep(1*100); } catch (InterruptedException e) { e.printStackTrace(); } percent = i+"%"; } if(logger.isDebugEnabled()){ logger.debug("thread run over!"); } over = true; }}
6.取参数servlet-->此servlet是要被页面定时的调用,Process.java
被调用时,会取出当前任务线程,获取当前任务线程中的进度参数,同时将进度参数传到页面.protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { Progress p = (Progress) request.getSession().getAttribute("progress"); if (p!=null) { String percent = p.getPercent(); request.setCharacterEncoding("utf-8"); response.setContentType("text/html;charset=utf-8"); response.getWriter().write(percent); } if(p.isOver()){ request.getSession().removeAttribute("progress"); }}