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

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

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

2.问题分析 :查看layerUI的API发现,系统的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快速点击会重复触发事件的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • 改变layer confirm弹窗按钮的颜色方法

    原来的颜色: 改造后的颜色: js: layer.confirm("您选的时间是:xxxx", { title : "预约时间确认", skin : "my-skin", btn : [ '确定', '取消' ]//按钮 }, function(index) { layer.close(index); //自定义代码 }); css: .my-skin .layui-layer-btn a { background-color: #84c101;

  • 解决layer.confirm选择完之后消息框不消失的问题

    如下所示: layer.confirm('主题库里已存在相同的表', function(){ ..........//处理结果 }); 当用户选择完确定之后,消息框不会消失,并且代码会继续执行,会出现代码后需要显示的信息已经出现但是消息框仍然显示在最前面(跳转页面不算) 这是要用layer.closeAll('dialog');这个代码关闭信息框 layer.confirm('主题库里已存在相同的表', function(){ layer.closeAll('dialog'); ........

  • layer.confirm点击第一个按钮关闭弹出框的方法

    layer.confirm弹出框,当你点击第一个按钮的时候,这个弹出层不会关闭,也是给一些小伙伴带来了一些困扰, 下面分享两个解决方案: ①可以将第一个按钮的回调函数传一个index,然后使用layer.close("index")就可以点击第一个按钮的时候关闭弹出框了,代码如下: ②第二种方法就非常的粗暴了,你可以直接在这个回调函数中写: layer.closeAll('dialog'); 也能实现点击第一个按钮的时候关闭弹出框 以上这篇layer.confirm点击第一个按钮关闭弹

  • layer.confirm取消按钮绑定事件的方法

    也可以通过 btn: ['确定','取消','按钮三'],来修改和增加按钮. // layer.confirm(content, options, yes, cancel) layer.confirm('is not?', {icon: 3, title:'提示',yes: function(index){ //do something layer.close(index); }, cancel: function(index, layero){ layer.close(index); relo

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

    layer.confirm快速点击会重复触发事件问题 1 .问题描述: 快速点击会出现,重复触发事件,像后台发起多次请求,此时后台极端=短时间内多次请求,会出现并发问题,数据脏读 2.问题分析 :查看layerUI的API发现,系统的confirm是线程阻塞的,而layer.confirm是非阻塞的 3.问题解决 方案1. 防止重复触发事件,前台js加锁 方案2.后台代码加乐观锁 此时,方案1解决这个问题最佳 4.具体实现: //出库 output: function () { console.

  • 详解小程序如何避免多次点击,重复触发事件

    作为前端开发,我们经常会遇到的场景,比如用户点击获取验证码按钮时,没有反应,大部分用户都会接着点击,这就会造成用户收到多条验证码,这是因为后台api请求比较慢,而客户端体验又做得不到位,导致用户以为没点击到或者是页面假死,在上次请求还没处理完,就再次点击按钮.这对于我们开发来说,这是bug. 如何解决或避免这个问题呢?一般来说有两种情况. 1.点击事件是执行网络请求(提交评论,验证码,支付) 这种情况下可以在请求执行之前显示一个模式的加载框,请求完成后再关闭加载框. 由于小程序在1.1.0版本基

  • Android 快速实现防止网络重复请求&按钮重复点击的方法

    在日常开发过程中,偶尔会出现一些极端问题.比如 网络重复请求,很难过滤 请求的问题. 下面一段代码,可以解决这个重复请求的问题. 下面上一段代码: private long lastClick; // 防止网络重新请求 if (System.currentTimeMillis() - lastClick <= 1000) { return; } lastClick = System.currentTimeMillis(); 以上这篇Android 快速实现防止网络重复请求&按钮重复点击的方法

  • 解决layer弹出层的内容页点击按钮跳转到新的页面问题

    在参与的一个项目中,有一个这样的需求,导入基础数据成功后,默认弹出一个管理员登录页,点击登录按钮,需要跳到管理页面. 导入页按钮: <button type="button" id="start" class="layui-btn layui-btn-radius layui-btn-lg layui-bg-orange btn3"><i>导入</i></button> 导入按钮的点击事件,点击后会

  • jQuery 防止相同的事件快速重复触发方法

    重复触发就是防止用户重复点击提交数据了,我们一般都是点击之后没反应会再次点击了,这个不但要从用户体验上来做好,还在要js或php程序脚本上做好,让用户知道点击是己提交服务器正在处理,下面我就整理从脚本上来处理此重复触发的问题. 很多时候事件会被快速重复触发,比如 click,这样就会执行两次代码,造成很多后果.现在有比较多的解决方法,但几乎都有局限性,比如一个 Ajax 表单,如果防止用户一次点好多下可以在第一次点击的时候冻结提交按钮,直到允许再次点击的时候再放开.很多人都这样干,但在其他的情况

  • 解决layer.open后laydate失效的问题

    如果你的open方式是1(html)的话这样是可以的, 如果是2(iframe)方式打开,你把注入的代码写在打开的界面就可以了不用这样写,open的参数type是有区别的,所以请注意: 今天在开发项目时候使用到了laydate,按照官方文档说明使用发现出现下面的问题: 1.在正常页面中使用laydate组件没有问题,点击可以正常显示出来 2.但是在layer.open打开一个窗体后就没有效果了 分析思路:由于页面的加载如果js在页面元素显示之前就执行,那么就会出现无法渲染组件的问题,所有决定等元

  • 解决layer.open弹出框不能获取input框的值为空的问题

    最近使用layer框架来做页面弹出框操作.总是不能获取弹出框中input的值,代码如下:红色标记区域 添加js代码 //Ajax添加品牌 function addBrandWI(){ layer.open({ type: 0, title: '品牌添加', shadeClose: true, shade: 0.8, btn: ['保存', '取消'], area: ['40%', '70%'], content: $('#add_Brand').html(), yes:function(inde

  • 解决layer弹出层中表单不起作用的问题

    如下所示: var html = '<form class="layui-form" action="">' + '<div class="layui-form-item"><label class="layui-form-label">角色名</label><div class="layui-input-block"><input type

随机推荐