JS制作导入进度条

目录:

1. 问题描述

目前在Excel批量导入提交的地方会有需要进度条的要求,而且是真的进度条。想要实现进度条效果,可以做一个模拟进度条特效,实现最终效果。

222


2. 实现思路

通过EXCEL导入按钮,增加 导入之后JS事件 来处理


3. 示例讲解

打开报表,选择 模板>模板web属性>填报页面 设置,添加一个“EXCEL导入后” 事件。

222

javascript脚本:
-- 引用外部的JS文件 FR.$defaultImport('/com/fr/write/web/excel/es.js', 'js'); -- 引用外部的CSS文件 FR.$defaultImport('/com/fr/write/web/excel/es.css', 'css'); -- 创建一个DIV,设置相关参数(值) var div = $('<div style="width:200px;height:20px;z-index:10000;left: 800px;top: 0px;position:absolute"/>'); --NEW一个对象 FR.processbar =new FR.SingleProgressBar(); --赋初值 FR.processpane = div; $(FR.processbar.element).appendTo(div); --将DIV与BODY页面关联 div.appendTo($('body')); --执行方法,每0.5秒执行一次 setInterval(function() { var v = FR.processbar.value; --执行条件判断 if (v < 100) { --每次执行的内容 FR.processbar.setValue(v + 10); } }, 500); FR.processbar.setValue(100); --执行方法,每0.5秒执行一次 setTimeout(function() { FR.processpane.hide(); }, 500); 

保存,预览效果如上图。

附件列表


主题: 二次开发

文档内容仅供参考,如果你需要获取更多帮助,请咨询帆软技术支持
关于技术问题,您还可以通过帆软论坛获取帮助,论坛上有非常多的大神,有些水平比帆软工程师还要高哦。
若您还有其他非技术类问题,可以联系帆软传说哥(微信ID:frbiaoge)