0
点赞
收藏
分享

微信扫一扫

_layUi关于ajax与loading问题


技术交流群:958923746,有学习视频,文档等。

一、在用户提交ajax后需要将按钮置为不可点击,弹出loading小动画,防止用户重复点击发起请求。

下面采用两种解决这个问题。

一、使用JS锁。

var lock=false;
layer.confirm('确认提交吗?', {
btn: ['提交','取消'],
offset: '100px'
}, function(){
if(!lock){
lock = true;
addPlan();
}

这个办法也可以解决重复提交问题,不过不太好看,利用了我们后端的思想解决问题。

二、使用HTML样式解决,发送请求后将按钮置为不可点击。

不可点击标签:
$('#subtn').attr('disabled','true');
删除标签:
$('#subtn').removeAttr('disabled');

添加layui loading动画:
var index = layer.load(5, {time: 30*1000});
关闭动画:
layer.close(index);

第二种更加复合我们的前端交互,提高用户体验。

另外使用第二种需要将ajax的是否同步为true,如果不是true的话,动画不会出现,会一闪而过。亲测。

以上就是本文的全部内容。欢迎评论。

举报

相关推荐

0 条评论