解决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 相关文章推荐
【消息提示组件】,兼容IE6/7&&FF2
Sep 04 Javascript
基于jquery的文本框与autocomplete结合使用(asp.net+json)
May 30 Javascript
用显卡加速,轻松把笔记本打造成取暖器的办法!
Apr 17 Javascript
如何使用jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
Jul 09 Javascript
使用js的replace()方法查找字符示例代码
Oct 28 Javascript
jQuery的context属性用法实例
Dec 27 Javascript
jQuery中serializeArray()与serialize()的区别实例分析
Dec 09 Javascript
js addDqmForPP给标签内属性值加上双引号的函数
Dec 24 Javascript
浅谈React的最大亮点之虚拟DOM
May 29 Javascript
js+canvas实现验证码功能
Sep 21 Javascript
layer弹出层取消遮罩的方法
Sep 25 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
Jul 20 Javascript
小程序最新获取用户昵称和头像的方法总结
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连mysql和oracle数据库性能比较
2006/10/09 PHP
如何从一个php文件向另一个地址post数据,不用表单和隐藏的变量的
2007/03/06 PHP
PHP对象Object的概念 介绍
2012/06/14 PHP
PHP版 汉字转码的实现详解
2013/06/09 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(四)
2014/06/23 PHP
教你如何开启shopnc b2b2c 伪静态
2014/10/21 PHP
PHP制作百度词典查词采集器
2015/01/29 PHP
php实现微信支付之退款功能
2018/05/30 PHP
jQuery学习总结之元素的相对定位和选择器(持续更新)
2011/04/26 Javascript
JavaScript 布尔操作符解析  && || !
2012/08/10 Javascript
javascript改变position值实现菜单滚动至顶部后固定
2013/01/18 Javascript
jQuery动画animate方法使用介绍
2013/05/06 Javascript
Jquery动态更改一张位图的src与Attr的使用
2013/07/31 Javascript
JavaScript将数字转换成大写中文的方法
2015/03/23 Javascript
JS简单模拟触发按钮点击功能的方法
2015/11/30 Javascript
javascript时间排序算法实现活动秒杀倒计时效果
2021/01/28 Javascript
JQuery实现简单的服务器轮询效果实例
2016/03/31 Javascript
纯JS实现图片验证码功能并兼容IE6-8(推荐)
2017/04/19 Javascript
Angular 4环境准备与Angular cli创建项目详解
2017/05/27 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
详解vue-router 路由元信息
2017/09/13 Javascript
jQuery实现的手动拖动控制进度条效果示例【测试可用】
2018/04/18 jQuery
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
2018/09/04 Javascript
vue-drawer-layout实现手势滑出菜单栏
2020/11/19 Vue.js
在Python的Django框架中用流响应生成CSV文件的教程
2015/05/02 Python
pygame实现弹力球及其变速效果
2017/07/03 Python
Python基于分水岭算法解决走迷宫游戏示例
2017/09/26 Python
python通过配置文件共享全局变量的实例
2019/01/11 Python
详解python爬虫系列之初识爬虫
2019/04/06 Python
Python如何在DataFrame增加数值
2020/02/14 Python
H5 canvas中width、height和style的宽高区别详解
2018/11/02 HTML / CSS
美国礼品卡商城: Gift Card Mall
2017/08/25 全球购物
群众路线党员自我评议范文2014
2014/09/24 职场文书
2014年监理个人工作总结
2014/12/11 职场文书
人事文员岗位职责
2015/02/04 职场文书
婚礼必备主持词范本!
2019/07/23 职场文书