1)简单的等待界面:这种做法之所以说简单,就是在用法发送了处理命令后,立即在页面的某个地方替换一个waiting的图片,比如一个转圈的GIF,一张Loading的图片等,这种不称之为进度条,顶多就是个等待条,但通常还是可以给用户带来那么点满足,在业务量不大的情况下,也够用了。
2)真实的等待进度:比如说,我要在B/S系统中实现一个数据导入的功能,数据文件总共有100个,每个文件包含成千上万的数据,导入过程可能需要15分钟,那么我还用一个图片在那边打转吗?现在这样还是不够的,我可能需要让使用者知道,我当前处理的是第几个文件,还剩下几个,处理的百分比,并显示一个加载的真实进度条,这个进度条要如实反映处理的百分比。
实现1:由于用户处理的数据量大,可以在文件导入过程中,循环计算进度,并将进度信息存储在上下文中,并在前台页面定时从上下文读取进度数据,并在页面显示。这种方法思路比较直接。
实现2:使用观察者模式,实现进度主动通知。思路是:在处理过程中,计算进度信息,并将进度数据通知给观察者,前台页面定时向观察者咨询进度,并将进度显示到页面中。
js实现进度条的方法:
1.setTimeout和clearTimeout
setTimeout和clearTimeout