真是自己给自己挖坑，坑死人不偿命啊。

　　在用layui开发时，遇到这种情况，点击按钮出现一个弹出层，然而我不是用button按钮去实现的，而是用a标签做的，本来a标签也是可以实现的，在这里我无形中给自己挖了个坑。然后绕进去好半天不知道问题出在哪，直接上代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <link rel="stylesheet" href="../dist/css/layui.css">

</head>

<body>

    <a href="" class="layui-btn" id="btn">弹出层</a>

    <script src="../dist/layui.js"></script>

    <script src="../dist/jquery.min.js"></script>

    <script>

        layui.use('layer',function(){

            var layer = layui.layer;

            $("#btn").click(function(){

                layer.confirm('确定要删除吗？',{icon: 3, title:'提示'},function(index){

                    layer.close(index)

                })

            })

        })

    </script>

</body>

</html>

　　这样看似没问题，实则无法实现预期的弹出层效果，因为a是一个超链接，点击后会默认有跳转行为，因而弹出层事件只能短暂触发，而后迅速消失。

　　其实要解决这个问题，有几种办法，其一，直接删除href属性即可解决。其二、给href属性赋值，使其等于javascript:void(0); 这样就可以阻止超链接的跳转行为，也可以解决问题。其三，就是不使用a标签，而改用button按钮，就可以避免这个问题

关于layer的坑的更多相关文章

  1. CV基础知识点深入理解

    BN实现: Batch Normalization学习笔记及其实现: BatchNormalization 层的实现 使用Python实现Batch normalization和卷积层 Batch N ...

  2. Jquery ajax 同步阻塞引起的UI线程阻塞的坑（loading图片显示不出来，layer.load延迟）

    今天想做一个点击地市用ajax重新获取数据刷新页面功能,因为ajax属于耗时操作,想在获取数据且加载页面时显示加载遮罩层,结果发现了ajax的好多坑. 例如如上栗子,我想点击按钮让遮罩层显示,ajax ...

  3. ayui弹出层闪退，layer弹出层闪退，layer弹出层坑

    今天用layui的弹出层插件,发现两奇怪的问题: 1.弹窗打开事件还未绑定到任何按钮,可是点击form表单中的按钮可以打开我定义的弹出层 2.绑定弹出层到按钮,打开弹窗闪退 后面发现真如参考博文所说: ...

  4. tf.keras遇见的坑：Output tensors to a Model must be the output of a TensorFlow `Layer`

    经过网上查找,找到了问题所在:在使用keras编程模式是,中间插入了tf.reshape()方法便遇到此问题. 解决办法:对于遇到相同问题的任何人,可以使用keras的Lambda层来包装张量流操作, ...

  5. Mono+Jexus部署C# MVC的各种坑

    如果你看到这篇文章,先别急着动手,过完一遍,确定是你要的再动手. 别人提到的这里不赘述,只说查了好久才知道的. 1号坑:System.IO.FileNotFoundException Could no ...

  6. FastClick 填坑及源码解析

    最近产品妹子提出了一个体验issue —— 用 iOS 在手Q阅读书友交流区发表书评时,光标点击总是不好定位到正确的位置: 如上图,具体表现是较快点击时,光标总会跳到 textarea 内容的尾部.只 ...

  7. AngularJS结合RequireJS做文件合并压缩的那些坑

    我在项目使用了AngularJS框架,用RequireJS做异步模块加载(AMD),在做文件合并压缩时,遇到了一些坑,有些只是解决了,但不明白原因. 那些坑 1. build.js里面的paths必须 ...

  8. 避开unity的坑（转摘）

    避开unity的坑(转摘) 以下总结一部分来自经验之谈,一部分来自其他人的分享.总的来讲,unity开发原型和效果.验证想法,确实是无比便利.可能一个月就把核心玩法做得差不多.强大的编辑器功能让我们也 ...

  9. 文件夹管理工具(MVC+zTree+layer)(附源码)

    写在前 之前写了一篇关于 文件夹与文件的操作的文章  操作文件方法简单总结(File,Directory,StreamReader,StreamWrite )  把常用的对于文件与文件夹的操作总结了一 ...

随机推荐

  1. jmeter远程分布执行遇到的网卡坑（A Test is currently running，stop or ....）

    周末加班做一个项目app的性能测试,单机负载时由于公司给每个人的网络带宽上传下载流量就1M,300个用户并发就已经网络IO饱和了,虽然和相关部门协调过资源问题,但是收效甚微,因此打算先用分布部署压力机 ...

  2. 基于阿里云的JavaEE系统框架介绍

    基于阿里云的系统框架展望 1) CDN 用于缓存静态文件等等.七牛和阿里的都还可以. 七牛要做的久一点,各种图片处理的接口要完善一些 阿里的CDN要稍微好一点点,但是没有不安全的访问方式,访问稍微没有 ...

  3. Node.js 蚕食计划（二）—— 使用 http 模块搭建 Web 服务器

    Node.js 开发的目的就是为了用 JavaScript 编写 Web 服务器程序 这次就来介绍用 http 模块搭建服务器 一.项目构建 每个 Node 程序都可以看作一个模块,而每个模块都应该有 ...

  4. 淘宝NPM源的使用

    npm作为国外的node仓库安装工具,自然会受到我大长城防火墙的干扰,国内用户在安装相关的资源的时候,会出现安装失败,以及速度很慢的情况.为了解决npm安装的问题,国内出现了很多npm的镜像网址,ta ...

  5. webpack之loader实践

    初识前端模板概念的开发者,通常都使用过underscore的template方法,非常简单好用,支持赋值,条件判断,循环等,基本可以满足我们的需求. 在使用Webpack搭建开发环境的时候,如果要使用 ...

  6. Lambda 表达式，Java中应用Lambda 表达式

    一.Lambda 表达式 简单来说,编程中提到的 lambda 表达式,通常是在需要一个函数,但是又不想费神去命名一个函数的场合下使用,也就是指匿名函数. 链接:知乎 先举一个普通的 Python 例 ...

  7. Fiddler的hosts配置使用

    前提:使用fiddler的hosts配置,可以方便的配置自己想要测试环境,不需要每次配置hosts都到windows目录下去修改hosts文件 1.点击Tool->HOSTS,打开hosts的配 ...

  8. swift4.0 正则表达式判断手机号

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Menlo; color: #ffffff; background-color: #282b3 ...

  9. JDK中AbstractQueuedSynchronizer应用解析

    这个类首先是一个抽象类,定义了一个模板,很多java同步相关的类(ReetrantLock.Semaphore.CountDownLatch等)都是基于AbstractQueuedSynchroniz ...

  10. Java框架之Spring MVC（一）

    一.Spring简介 Spring MVC是当前最优秀的 MVC 框架,自从Spring 2.5 版本发布后,由于支持注解配置,易用性有了大幅度的提高.Spring 3.0 更加完善,实现了对 Str ...