解决layer.confirm快速点击会重复触发事件的问题


Posted in Javascript onSeptember 23, 2019

layer.confirm快速点击会重复触发事件问题

1 .问题描述: 快速点击会出现,重复触发事件,像后台发起多次请求,此时后台极端=短时间内多次请求,会出现并发问题,数据脏读

解决layer.confirm快速点击会重复触发事件的问题

2.问题分析 :查看layerUI的API发现,系统的confirm是线程阻塞的,而layer.confirm是非阻塞的

解决layer.confirm快速点击会重复触发事件的问题

3.问题解决

方案1. 防止重复触发事件,前台js加锁

方案2.后台代码加乐观锁

此时,方案1解决这个问题最佳

4.具体实现:

//出库
 output: function () {
   console.log("出库请求---");   	         
   var lock=false;//默认未锁定
   var myconfirm=layer.confirm('是否确认出库?',{btn: ['确定','取消']},function(index){
      console.log('success');
      console.log(lock);
       //
       if(!lock){
      	 lock=true;//锁定
        //发送
       console.log("ajax---");
        //发送ajax
        $.ajax({
         url: '/dubbo/../outBoundByTask.json',
         isAysn: false,
         type: 'get',
         contentType: 'application/json',
         data:params.join('&'),
         success: function (result) {
               	
         	var res=$.parseJSON(result);
         var code=res.code;
         	
         	if(code==0){
         		layer.msg("操作成功!");
         		window.location.reload();
         	}else{
         		layer.msg(res.msg);
         	}
         	
          

         }
        });
       }
       layer.close(myconfirm);
      }
      ,function(index){
       console.log('fail');
      });
    }

以上这篇解决layer.confirm快速点击会重复触发事件的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript高级程序设计
Dec 29 Javascript
jQuery查询数据返回object和字符串影响原因是什么
Aug 09 Javascript
JavaScript 数组详解
Oct 10 Javascript
基于jquery实现最简单的选项卡切换效果
May 08 Javascript
jQuery页面弹出框实现文件上传
Feb 09 Javascript
Bootstrap3多级下拉菜单
Feb 24 Javascript
jQuery实现手机号正则验证输入及自动填充空格功能
Jan 02 jQuery
微信小程序顶部导航栏滑动tab效果
Jan 28 Javascript
vue2.0+vue-router构建一个简单的列表页的示例代码
Feb 13 Javascript
微信小程序实现左右列表联动
May 19 Javascript
JavaScript编写开发动态时钟
Jul 29 Javascript
jQuery实现评论模块
Aug 19 jQuery
小程序最新获取用户昵称和头像的方法总结
Sep 23 #Javascript
中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)
Sep 23 #Javascript
layui内置模块layim发送图片添加加载动画的方法
Sep 23 #Javascript
微信头像地址失效踩坑记附带解决方案
Sep 23 #Javascript
微信小程序如何获取用户头像和昵称
Sep 23 #Javascript
微信小程序使用蓝牙小插件
Sep 23 #Javascript
微信小程序实现蓝牙打印
Sep 23 #Javascript
You might like
Smarty Foreach 使用说明
2010/03/23 PHP
PHP中怎样保持SESSION不过期 原理及方案介绍
2013/08/08 PHP
php fsockopen解决办法 php实现多线程
2014/01/20 PHP
PHP递归调用数组值并用其执行指定函数的方法
2015/04/01 PHP
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0
2008/03/22 Javascript
元素的内联事件处理函数的特殊作用域在各浏览器中存在差异
2011/01/12 Javascript
Javascript玩转继承(一)
2014/05/08 Javascript
jQuery功能函数详解
2015/02/01 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
2015/03/14 Javascript
nodejs中使用多线程编程的方法实例
2015/03/24 NodeJs
JavaScript:Array类型全面解析
2016/05/19 Javascript
9个让JavaScript调试更简单的Console命令
2016/11/14 Javascript
微信小程序 登录实例详解
2017/01/16 Javascript
JQuery实现ul中添加LI和删除指定的Li元素功能完整示例
2019/10/16 jQuery
[56:58]VP vs Optic 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python中的编码知识整理汇总
2016/01/26 Python
Python中的命令行参数解析工具之docopt详解
2017/03/27 Python
浅谈python3.6的tkinter运行问题
2019/02/22 Python
使用Python的Turtle绘制哆啦A梦实例
2019/11/21 Python
python实现二分类的卡方分箱示例
2019/11/22 Python
django框架基于queryset和双下划线的跨表查询操作详解
2019/12/11 Python
python读取yaml文件后修改写入本地实例
2020/04/27 Python
python如何爬取网页中的文字
2020/07/28 Python
Python中对象的比较操作==和is区别详析
2021/02/12 Python
纯CSS3代码实现文字描边
2016/04/25 HTML / CSS
Clarks西班牙官方在线商店:clarks鞋
2019/05/03 全球购物
世界上最伟大的马产品:Equiderma
2020/01/07 全球购物
Currentbody美国/加拿大:美容仪专家
2020/03/09 全球购物
求职信内容考虑哪几点
2013/10/05 职场文书
司机工作自我鉴定
2014/09/19 职场文书
2014年村支部书记四风对照检查材料思想汇报
2014/10/02 职场文书
官僚主义现象查摆问题整改措施
2014/10/04 职场文书
2015羊年春节慰问信
2015/02/14 职场文书
超市店长竞聘书
2015/09/15 职场文书
在校大学生才艺比赛策划书怎么写?
2019/08/26 职场文书
Java获取e.printStackTrace()打印的信息方式
2021/08/07 Java/Android