JSP数据分页导出下载显示进度条样式
1、思路
分页数据查询,同时缓存设置进度(为当前取出数据点总数据比例)
2、界面进度条为异步请求缓存比例
3、代码
css:
body{ position:relative; } .mask{ position:absolute; left:0px; top:0px; height:100%; width:100%; background-color:#eee; display:none; filter:alpha(opacity=50);/*IE滤镜,透明度50%*/ -moz-opacity:0.5;/*Firefox私有,透明度50%*/ opacity:0.9;/*其他,透明度50%*/ z-index:999; } .out{ margin:auto; margin-top:20%; text-align:center; height:30px; width:500px; background-color:#fff; border:1pxsolidred; position:relative; } .in{ position:absolute; left:-1px; top:0px; height:28px; width:0px; background-color:red; } .num{ position:absolute; left:0px; top:0px; height:30px; line-height:30px; width:500px; text-align:center; position:relative; }
js:
$(function(){ $(.donwload).click(function(){ varulr=----; varkey=newDate().getTime(); url+="?key="+key; downloadFile(url); process(key); }); }); functiondownloadFile(url){ try{ varelemIF=document.createElement("iframe") elemIF.style.display="none"; document.body.appendChild(elemIF); elemIF.src=url; }catch(e){ } } functionprocess(key){ $.ajax({ type:'GET', url:----------, async:true, success:function(data){ if(data){ data=parseFloat(data).toFixed(2); $(".in").css("width",(data/100*500)+"px"); $(".num").text(data+"%"); if(data>=100){ setTimeout(function(){ $(".mask").hide(); },3000); }else{ setTimeout(function(){ process(key); },1000); } } }, error:function(){ } }); }
downaction
try{ redisTemplate.opsForValue().set("down_process_"+qm.getKey(),0.1); inti=0; while(true){ qm.getPage().setNowPage(i++); qm.getPage().setPageSize(100); Pagedbpage=取当前页数据 List<>list=(List<>)dbpage.getResult(); if(list!=null&&list.size()>0){ if(list.size()<100){ redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100); }else{ doubleprocess=i*100.0/dbpage.getTotalCount()*100; if(process<0.1)process=0.1d; redisTemplate.opsForValue().set("down_process_"+qm.getKey(),process); } } logger.info("-------value:"+redisTemplate.opsForValue().get("down_process_"+qm.getKey())); if(list==null||list.size()<100){ redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100); break; } logger.info("-------value:"+redisTemplate.opsForValue().get("down_process_"+qm.getKey())); continue; } }catch(){ }finally{ redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100); redisTemplate.expire("down_process_"+qm.getKey(),5,TimeUnit.MINUTES); } publicdoubleprocess(HttpServletRequestrequest,HttpServletResponseresponse,@PathVariable(value="key")Stringkey)throwsIOException{ Doubleprocess=0.1d; try{ inti=0; while(true){ if(i>=2){ process=100d; break; } i++; if(redisTemplate.opsForValue().get("down_process_"+key)==null){ Thread.currentThread().sleep(1000l); continue; }else{ process=Double.valueOf(redisTemplate.opsForValue().get("down_process_"+key).toString()); break; } } }catch(Exceptione){ process=0.1d; e.printStackTrace(); }finally{ returnprocess; } }
以上所述是小编给大家介绍的JSP数据分页导出下载显示进度条样式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!