LayUi,layer弹窗.ajax同步传输时.关闭弹窗延时

今天在做大数量处理时，准备使用循环 post传输，返回结果调用进度条。

结果遇到了post同步处理时，使用的layer是否弹窗时，无法关闭的情况。

整体流程如下：

       第一步 ：使用layer弹窗，询问是否处理以下数据.

       第二步 ：加载进度条。

       第三步 ：循环处理数据,ajax发送到后台，返回结果,同时进度条变更。

       第四步：成功后弹窗提示成功与失败数据。

第一次：（发现问题）

       发现ajax是异步，数据显示不正确

       修改为同步再ajax配置中 增加 async:false.

       结果：layui弹窗不关闭，进度条完全被覆盖不显示。

第二次：（寻找解决办法：失败）

       百度与去官方论坛寻找，发现layer确实有如此问题，暂时无解决办法。

第三次：（自己尝试：失败）

      尝试使用控件元素事件。

      当关闭layer事件执行后，调用其他元素的点击事件，来触发数据处理。

      失败无效，发现点击事件一样需要同步等待。

第四次：（尚未尝试）

      准备尝试使用赋值给一个隐藏本文框，然后监听其变化事件，当变化后执行数据处理。

      未完成，突然想到可以使用异步判断是否ajax都已经返回，直接撤回代码。改回异步从新尝试。

第五次：（失败）

      定义一个变量resultCount，每次返回后resultCount++；

      当resultCount==count(list)时执行数据处理。

      结果：异步处理首先执行数据处理代码，而后判断失败。

第六次：

     加入定时器，setInterval，0.5秒一次判断是否全部已经返回 resultCount==count(list) 。

     基本成型，还有个小问题是进度条还再循环中，进度读取失败。

第七次。

    将进度条挪到定时器中，简短性加载进度条。

    完成。

以下是代码：

layer.open({
  content: content,
  btn: ['确认', '取消'],
  yes: function(index, layero){
    layer.close(index);
    var lenthList = list.length;
    var resultCount = 0;
    //加载进度条
    processbar(0,lenthList);
    for(var i=0;i<lenthList; i++){
      $.ajax({  
           type : "post", 
           url : url,  
           data : {id:list[i]},
           dataType : 'json',
           success : function(data){ 
             resultCount++;
             processData(); //处理数据
           }  
         })
       }
       //定义定时器
       var timer = setInterval(function(){ 
       processbar(resultCount,lenthList);
       if(resultCount==lenthList){
         clearInterval(timer);
         showMessage('完成');
       }
     }, 500);
   },
   btn2: function(index, layero){
    layer.close(index);
  }
})

后记：ES6后 推荐使用  Promise 当然也可以 async/await