layer数据加载中,loading的显示

1.layer中的数据加载中layer.load
loadIndex = layer.load(2,{time:20*1000});
layer.load()参数选填,
第一个参数为样式参数,默认0,还有1,2;time设置最长等待时间20秒,
有返回结果时在success中调用layer.close(loadIndex);关闭加载中的提示弹窗

2.实际调用

$.ajax({
            type: "get",
            url: _url,
            cache:false,
            dataType:"json",
            beforeSend:function(){
                //显示正在加载数据
                loadIndex = layer.msg('读取中,请稍候...', {icon: 16,time:20*1000});
            },
            success: function(result){
                layer.close(loadIndex);
                if(result.code == 200){
                    layer.open({
                        type: 1,
                        skin: 'layui-layer-rim', //加上边框
                        area: ['50%', '60%'], //宽高
                        content: '<div class="file_data" style="margin: 10px;padding: 10px">返回内容</div>'
                    });
                }else {
                    layer.alert('暂无数据');
                }
            }
        });
  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要将 jqGrid loading 改为 layui.loading 并居加载,可以按照以下步骤进行操作: 1. 在页面引入 layui 的样式文件和 js 文件。 ```html <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/layui/2.5.6/css/layui.min.css"> <script src="https://cdn.bootcdn.net/ajax/libs/layui/2.5.6/layui.min.js"></script> ``` 2. 定义一个方法,用于显示 layui 的 loading。 ```javascript function showLoading() { var loading = layui.layer.load(2, { shade: [0.3, '#333'] }); return loading; } ``` 该方法,`layui.layer.load()` 方法用于显示 loading,参数 2 表示显示类型为转圈加文字,`shade` 参数表示遮罩层颜色和透明度。 3. 在 jqGrid 加载数据显示 loading加载完成后隐藏 loading。 ```javascript // 在 jqGrid 加载数据显示 loading $("#grid").jqGrid({ ... loadBeforeSend: function(xhr, settings) { var loading = showLoading(); $(this).data("loading", loading); // 将 loading 对象存储在 jqGrid }, ... }); // 加载完成后隐藏 loading $("#grid").jqGrid({ ... loadComplete: function(data) { var loading = $(this).data("loading"); layui.layer.close(loading); }, ... }); ``` 在 `loadBeforeSend` 回调函数,调用 `showLoading` 方法显示 loading,并将 loading 对象存储在 jqGrid 。在 `loadComplete` 回调函数,通过 `$(this).data("loading")` 获取存储的 loading 对象,并调用 `layui.layer.close` 方法隐藏 loading。 4. 居显示 loading。 ```css #layui-layer2 { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); } ``` 通过给 loading 所在的 div(id 为 `layui-layer2`)设置样式,使其在页面居显示。 以上就是将 jqGrid loading 改为 layui.loading 并居加载的步骤。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值