layui 实现加载动画以及非真实加载进度的方法
近期在做一个网站的查询功能，但是由于数据量确实太大，分页查询后也是很慢，同时查询出的数据部分还要进行一些处理，导致用户说要我们给他们加一个查询进度，要百分比显示。加上加载动画很简单，layui有现成的。但是还要动画。。我tm（手动微笑），原谅我水平比较低。然后就瞎搞，终于搞出了一个加载的进度，虽然还是假的。。。
上面废话有点多，直接切入正题。
首先是html代码。。。。。（不存在的2333333........）
然后是js代码：
//这里是必须要有的，_index的作用是用来关闭遮罩，详细看layui的文档
var_index;
var_lp_baseTime=0;
var_lp_startTime=0;
functionupdateLoadProgress(){
if(_lp_baseTime<0){
layer.close(_index);
return;
}
vardval=parseInt(newDate().valueOf())-parseInt(_lp_startTime);
vartimeDifference=(dval/_lp_baseTime).toFixed(2);
varlp=timeDifference<1?timeDifference*100:99;
$("#loadProgress").html(parseInt(lp));
setTimeout(function(){updateLoadProgress();return;},650);
}
function你的函数(){
$.ajax({
url:url,
async:true,
data:{},
beforeSend：function(){
//敲黑板
_index=layer.load(1,{
content:"正在查询(0%) OK，就是这么多，主要是利用预估的时间与现在已进行时间进行预估做比较，所以实际使用的时候还要进行一定程度的调整，但是，最起码也是个思路是不是233333，参考一下吧
超过时间时进度会定格在99%，所以，emmmm....注意预留一些时间
以上这篇layui实现加载动画以及非真实加载进度的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。