layer.load()与ajax的结合使用

在执行ajax请求时,使用layui的layer.load()显示加载效果,提高用户体验。文章详细介绍了layer.load的三种使用方式,如何自定义加载样式,以及在请求成功或失败时关闭加载层的方法。同时讲解了在ajax完成后如何刷新父页面,确保数据的实时更新。重点强调了load方法在异步请求中的应用,并提供了相关layui资源链接。
摘要由CSDN通过智能技术生成

使用情景

在执行添加或修改的时候,需要将数据提交到后台进行处理,这时候使用ajax进行请求和回调返回,这时候执行请求成功之后最理想的状态是关闭弹出层并且刷新列表的数据信息

通常写法

1、load方法提供三种风格供选择。(icon支持传入0-2如果是0,无需传,如果超过2,默认0)

方法一:loadIndex = layer.load(); //不传参,默认0

方法二:loadIndex = layer.load(1); // 1,另外一种风格

方法三: loadIndex = layer.load(icon,options); // 设置其他参数

var loadIndex = layer.load(2,{
   
	time:1000, //1秒后关闭
	shadow: [0.5, '#f5f5f5'], //遮罩(即弹层外区域),默认是0.3透明度的黑色背景('#000'),关闭可以设shadow:0/false  类型:String/Array/Boolean,默认:0.3  
	content:'加载中........',
	offset:'rt'//类型:String/Array,默认:垂直水平居中(auto或不设置)
	});

其余基础参数见https://www.layui.com/doc/modules/layer.html#base

自定义load样式

var index = layer.load(2, {
    
    shade: [0.4, '#000'
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值