制作进度条

二次开发 >> JavaScript >> FR的JS实例 >> 填报预览JS实例>> 制作进度条

制作进度条

  描述

  实现方案

1.描述

       目前在Excel批量导入提交的地方有进度条，而且是真的进度条。想要实现进度条效果，只能做一个模拟进度条效果，实现效果。

2实现方案

    2.1 我们通过EXCEL导入 按钮， 增加 导入之后事件 具体可参看：   Excel导入自由报表     http://www.finereporthelp.com/help/13/29/1.html

      

      

开始事件：

1. FR.$defaultImport('/com/fr/write/web/excel/es.js', 'js');
   
2. FR.$defaultImport('/com/fr/write/web/excel/es.css', 'css');  -- 引用外部的JS 和 CSS   
   
3. var div = $('<div style="width:200px;height:20px;z-index:10000;left:100px;top:100px;position:absolute"/>');  -- 创建一个DIV，设置参数
   
4. FR.processbar =new FR.SingleProgressBar();
   
5. FR.processpane = div;
   
6. $(FR.processbar.element).appendTo(div);
   
7. div.appendTo($('body'));    -- 将DIV 与body页面关联
   
8. 
   
9. --执行方法， 每0.5秒，执行一次
   
10. setInterval(function() {
    
11.     var v = FR.processbar.value;
    
12.     if (v < 100) {
    
13.         FR.processbar.setValue(v + 10);
    
14.     }
    
15. }, 500);
    

复制代码

结束事件：

1. FR.processbar.setValue(100);
   
2. setTimeout(function() {
   
3.     FR.processpane.hide();
   
4. }, 500);
   
5. </p>

复制代码

2.3 效果预览

   

附件：
ExcelImport_3.cpt (17.96 KB, 下载次数: 117)

2015-8-12 19:05 上传

点击文件名下载附件

excelimport_3.xls (26.5 KB, 下载次数: 89)

2015-8-12 19:05 上传

点击文件名下载附件

                                

能不能跟批量导入的做结合，这样会更好！

厉害，赞楼主

评分： 难度40
           详尽度15
           通用度10

建议：
1.
描述做下修改，简单描述当前功能的应用场景，实现思路 难度+5
2.对代码部分做些注释或者解释 详尽度+5
3.解释描述一下是否可以扩展到所有的可应用进度条的事件（比如提交入库、数据加载等） 通用度+8

难度 40
详尽度30
通用度15

写的很好

可以的！！！

先顶起来。。。。。

有没有哪个大神有填报的进度条

再次学习了

导入信息后原来的表单格式都发生了变化

有没有哪个大神有填报的进度条

啦啦啦啦啦啦啦

查询的进度条可以实现吗

666666666666