layui加载层的写法

Posted 2020-10-03 冒泡泡的可乐。0

1. <script type="text/javascript" src="jquery-1.8.3.min.js"></script>  
2.     <script type="text/javascript" src="layer/layer.js"></script>  

//在js中写出前后加载的函数 加载层
 1 ; !function () {
 2             layer.config({//加载扩展模块  
 3                 extend: ‘../lib/jquery.plugins/layer/extend/layer.ext.js‘
 4             });
 5             layer.ready(function () {
 6             });
 7         }();
 8 
 9         function ityzl_SHOW_LOAD_LAYER() {
10             return layer.msg(‘努力中...‘, { icon: 16, shade: [0.5, ‘#f5f5f5‘], scrollbar: false, offset: ‘50%‘, time: 300000 });
11         }
12         function ityzl_CLOSE_LOAD_LAYER(index) {
13             layer.close(index);
14         }
15         function ityzl_SHOW_TIP_LAYER() {
16             layer.msg(‘恭喜您，加载完成！‘, { time: 1000, offset: ‘50%‘ });
17         } 

 1 //ajax做处理 当然 也可以是点击事件。
 2 var i;
 3         $(function () {
 4             $.ajax({
 5                 type: "POST",
 6                 dataType: "text",
 7                 url: "",
 8                 beforeSend: function () {
 9                    i = ityzl_SHOW_LOAD_LAYER();
10                 },
11                 success: function (msg) {
12                     ityzl_CLOSE_LOAD_LAYER(i);
13                     ityzl_SHOW_TIP_LAYER();
14                 },
15                 error: function (e, jqxhr, settings, exception) {
16                     ityzl_CLOSE_LOAD_LAYER(i);
17                 }
18             });
19         });