解决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 confirm选择判断
Oct 18 Javascript
js中匿名函数的N种写法
Sep 08 Javascript
JQueryEasyUI datagrid框架的基本使用
Apr 08 Javascript
jQuery实现设置、移除文本框默认值功能
Jan 13 Javascript
jQuery hover事件简单实现同时绑定2个方法
Jun 07 Javascript
JS仿淘宝搜索框用户输入事件的实现
Jun 19 Javascript
移动端效果之IndexList详解
Oct 20 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
Nov 04 Javascript
解决Vue打包上线之后部分CSS不生效的问题
Nov 12 Javascript
微信小程序转化为uni-app项目的方法示例
May 22 Javascript
Vue详细的入门笔记
May 10 Vue.js
vue实现书本翻页动画效果实例详解
Apr 08 Vue.js
小程序最新获取用户昵称和头像的方法总结
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
PHP与SQL注入攻击[二]
2007/04/17 PHP
php从给定url获取文件扩展名的方法
2015/03/14 PHP
PHP编程文件处理类SplFileObject和SplFileInfo用法实例分析
2017/07/22 PHP
PHP的HTTP客户端Guzzle简单使用方法分析
2019/10/30 PHP
Exjs 入门篇
2010/04/07 Javascript
jquery创建一个新的节点对象(自定义结构/内容)的好方法
2013/01/21 Javascript
jquery 卷帘效果实现代码(不同方向)
2013/02/05 Javascript
Javascript查询DBpedia小应用实例学习
2013/03/07 Javascript
JavaScript函数使用的基本教程
2015/06/04 Javascript
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
2015/08/26 Javascript
bootstrap输入框组使用方法
2017/02/07 Javascript
node.js爬虫爬取拉勾网职位信息
2017/03/14 Javascript
浅析node Async异步处理模块用例分析及常用方法介绍
2017/11/17 Javascript
详解AngularJS之$window窗口对象
2018/01/17 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
编写更好的JavaScript条件式和匹配条件的技巧(小结)
2019/06/27 Javascript
微信小程序按顺序同步执行的两种方式
2019/12/20 Javascript
vue+element-ui表格封装tag标签使用插槽
2020/06/18 Javascript
React+EggJs实现断点续传的示例代码
2020/07/07 Javascript
解决idea开发遇到javascript动态添加html元素时中文乱码的问题
2020/09/29 Javascript
可用于监控 mysql Master Slave 状态的python代码
2013/02/10 Python
使用基于Python的Tornado框架的HTTP客户端的教程
2015/04/24 Python
python抓取并保存html页面时乱码问题的解决方法
2016/07/01 Python
利用Python批量提取Win10锁屏壁纸实战教程
2018/03/27 Python
python将秒数转化为时间格式的实例
2018/09/16 Python
pytorch 加载(.pth)格式的模型实例
2019/08/20 Python
北美个性化礼品商店:Things Remembered
2018/06/12 全球购物
美国医生配方营养补充剂供应商:Healthy Directions
2019/07/10 全球购物
莫斯科大型旅游休闲商品超市:Camping.ru
2020/09/16 全球购物
公司年会晚宴演讲稿
2014/01/06 职场文书
大学优秀班集体申报材料
2014/05/23 职场文书
分公司负责人任命书
2014/06/04 职场文书
车辆年检委托书范本
2014/10/14 职场文书
中国汉字听写大会观后感
2015/06/02 职场文书
企业法人代表证明书
2015/06/18 职场文书
《家》读后感:万惜拯救,冷暖自知
2019/09/25 职场文书