今天遇到一个问题:

  layer弹出一个confirm提示窗,然后confirm还没有点击对应的按钮的时候,就已经执行了后续代码,我这里做出的判断是,是否需要进行后续操作,但是因为layer.confitm的非阻塞式的特性导致我这个控制失效,无法达到点击确定或者取消的效果。

研究了几个方法,都不怎么样,有些方法是把后续操作全部放到回调函数里面去,但是这个操作影响到我目前的逻辑,对方法的封装也不友好,所以就抛弃了。

  后面自己谷歌到一个通过async关键字来实现阻塞式弹窗的方法:直接上图

首先在你需要阻塞的方法的开始写关键字async,

我这里是一个点击事件,所以直接function上加上async关键字。

然后内部需要阻塞执行的方法前面需要加上await关键字,如图:

这样就可以让代码停在这个方法,需要注意的是,我这里的MrIsLocked()这个方法,在写方法具体逻辑的时候,也需要加async关键字,

也就是声明方法的时候,如图:

  简单的来说,就是在弹窗的方法声明时候加上async关键字,调用该方法的时候加上await关键字,就可以达到这个效果了。

如果有写的不对的,还望大佬们斧正。

layer做阻塞式弹出层的方法的更多相关文章

  1. layer父页获取弹出层输入框里面的值

    主要是因为修改功能,原来页面填写数据如图 改为 其中点击填写明细弹出框 填写完毕后点击确认返回,同事这里因为她是存的多表,所以点击确认就直接保存数据了,改的这个功能原本保存是整体保存,我就不想改原来的 ...

  2. apiCloud结合layer实现动态数据弹出层

    css /** 我的二维码 begin **/ .aui-list .wechat-media { width: 3rem; } .wechat-middle { padding: 1.3em 3.2 ...

  3. Layer组件多个iframe弹出层打开与关闭及参数传递

    一.Layer简介 Layer是一款近年来备受青睐的web弹层组件,基于jquery,易用.实用,兼容包括IE6在内的所有主流浏览器,拥有丰富强大的可自定义的功能. Layer官网地址:http:// ...

  4. layer弹出层的关闭及父页面的刷新问题

    当在主页面执行添加或修改时,用弹出层是比较好的选择,如何关闭弹出层并对父级页面进行操作呢 首先在父级页面中打开一个添加页面(弹出层) 在添加页面的表单提交函数中添加如下代码: function for ...

  5. 弹出层layer演示 以及在编写弹出层时遇到的错误

    实现的功能: 首先第一步 在官方下载layer的文件.layUI官网:http://layer.layui.com/     http://layer.layui.com/ layer文件的下载步骤如 ...

  6. layui弹出层回调的使用

    <%@page language="java" contentType="text/html; charset=UTF-8"%> <%@ in ...

  7. div弹出层的效果带关闭按钮

    下面我做的这个是个进度条的弹出层 <style type="text/css"> #tuxiang { width: 57px; } /*div弹出框的css*/ .t ...

  8. 权限管理系统之LayUI实现页面增删改查和弹出层交互

    由于对LayUI框架不太熟悉,昨天抽空看了下LayUI的文档,今天在网上找了使用LayUI进行增删改查相关内容,自己照葫芦画了个瓢,画瓢部分不是很难,主要是下午遇到了一个弹出层的问题耗时比较久. 同一 ...

  9. 弹出层-layui

    type 0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层) 弹出层 //winIndex存储弹出层的index,以便关闭弹出层时使用 function openWindo ...

随机推荐

  1. WindowsServer系统设置U盘引导及安装

    准备一台服务器,我的服务器上图. 1.开机启动,按DEL进入BIOS.我的显示如下图,按F7进入. 2.找到设置启动项的地方 3.修改U盘启动项 4.保存退出. 5.重启服务器正常的话应该能够从U盘引 ...

  2. C语言网络编程(Linux && Windows)(1)

    和朋友一起做课程设计,同时学习C语言的网络编程,以前写的都是python网络编程,但python很多的库都是封装好的,大部分人在使用的时候不会去了解底层的实现,这样对长远的学习不太好,也改正自己这方面 ...

  3. [BJDCTF 2nd]Schrödinger && [BJDCTF2020]ZJCTF,不过如此

    [BJDCTF 2nd]Schrödinger 点进题目之后是一堆英文,英语不好就不配打CTF了吗(流泪) 复制这一堆英文去谷歌翻译的时候发现隐藏文字 移除test.php文件,访问test.php ...

  4. CSS图标与文字对齐的两种方法

    在平时写页面的过程中,常遇到要把小图标与文字对齐的情况.比如: 总结了两种方法,代码量都比较少. 第一种 对img设置竖直方向对齐为middle, <div> <img src=&q ...

  5. CSS基础-Flexbox

    flexbox 是一种一维的布局模型,它给 flexbox 的子元素之间提供了强大的空间分布和对齐能力. 说 flexbox 是一种一维的布局,是因为一个 flexbox 一次只能处理一个维度上的元素 ...

  6. vue基础题

    一.对于MVVM的理解? MVVM 是 Model-View-ViewModel 的缩写. Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑. View 代表UI 组件,它负责 ...

  7. mvvm和mvc区别?

    mvc和mvvm其实区别并不大.都是一种设计思想.主要就是mvc中Controller演变成mvvm中的viewModel. mvvm主要解决了mvc中大量的DOM 操作使页面渲染性能降低,加载速度变 ...

  8. 网络层-network layer(下):网络互连、子网掩码计算方法、Ipv4报头解析

    第五章 网络层-Network Layer(下) 上一章讲了网络层的任务.提供的两种服务.五个重要的路由算法.以及网络层的拥塞控制和服务质量问题.这一部分主要讲一讲网络互连问题和Internet的网络 ...

  9. Day7 python高级特性-- 切片 Slice

    先举一个例子,取list或tuple中的某几个元素:     1.取 ['a','b','c','d','e','f'] 第1.2.5.6个元素:        >>> a = [' ...

  10. JavaSE23-函数式接口&Stream流

    1.函数式接口 1.1 函数式接口概述 概念 有且仅有一个抽象方法的接口 如何检测一个接口是不是函数式接口 @FunctionalInterface 放在接口定义的上方:如果接口是函数式接口,编译通过 ...