解决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 相关文章推荐
JS 有名函数表达式全面解析
Mar 19 Javascript
jQuery中parents()和parent()的区别分析
Oct 28 Javascript
html的DOM中Event对象onblur事件用法实例
Jan 21 Javascript
jquery选择器简述
Aug 31 Javascript
基于JavaScript代码实现pc与手机之间的跳转
Dec 23 Javascript
jQuery事件对象总结
Oct 17 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
Nov 01 Javascript
详解Eslint 配置及规则说明
Sep 10 Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
Mar 01 Javascript
js 将线性数据转为树形的示例代码
May 28 Javascript
如何在Angular8.0下使用ngx-translate进行国际化配置
Jul 24 Javascript
微信小程序 授权登录详解(附完整源码)
Aug 23 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代码质量36计
2012/09/05 PHP
php 批量生成html,txt文件的实现代码
2013/06/26 PHP
php代码审计比较有意思的例子
2014/05/07 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
PHP文件操作之获取目录下文件与计算相对路径的方法
2016/01/08 PHP
php函数传值的引用传递注意事项分析
2016/06/25 PHP
PHP 验证身份证是否合法的函数
2017/02/09 PHP
使用Grunt.js管理你项目的应用说明
2013/04/24 Javascript
js获取本机的外网/广域网ip地址完整源码
2013/08/12 Javascript
向左滚动文字 js代码效果
2013/08/17 Javascript
JavaScript中Null与Undefined的区别解析
2015/06/30 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
2016/07/01 Javascript
深入剖析JavaScript面向对象编程
2016/07/12 Javascript
canvas实现绘制吃豆鱼效果
2017/01/12 Javascript
如何使用bootstrap框架 bootstrap入门必看!
2017/04/13 Javascript
纯js实现画一棵树的示例
2017/09/05 Javascript
如何快速解决JS或Jquery ajax异步跨域的问题
2018/01/08 jQuery
详解vue组件基础
2018/05/04 Javascript
vue配置nprogress实现页面顶部进度条
2019/09/21 Javascript
jQuery插件simplePagination的使用方法示例
2020/04/28 jQuery
在Django框架中伪造捕捉到的URLconf值的方法
2015/07/18 Python
Python使用matplotlib绘制正弦和余弦曲线的方法示例
2018/01/06 Python
Python机器学习之K-Means聚类实现详解
2018/02/22 Python
python线程的几种创建方式详解
2019/08/29 Python
python常见字符串处理函数与用法汇总
2019/10/30 Python
安装python3.7编译器后如何正确安装opnecv的方法详解
2020/06/16 Python
详解基于python的全局与局部序列比对的实现(DNA)
2020/10/07 Python
详解html5 canvas 微信海报分享(个人爬坑)
2018/01/12 HTML / CSS
高档奢华时装在线目的地:FORWARD by elyse walker
2017/10/16 全球购物
澳大利亚波希米亚风时尚品牌:Tree of Life
2019/09/15 全球购物
抽象方法、抽象类怎样声明
2014/10/25 面试题
求职信的七个关键技巧
2014/02/05 职场文书
后备干部考察材料
2014/02/12 职场文书
中秋晚会致辞
2015/07/31 职场文书
利用Python实现Picgo图床工具
2021/11/23 Python
mysql中关键词exists的用法实例详解
2022/06/10 MySQL