layui加载层的写法


  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         });

 

 

posted on 2017-08-18 09:40  可乐冒泡泡丶  阅读(4726)  评论(0编辑  收藏  举报