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

　　在用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. 6、投资的一些思考 - CEO之公司管理经验谈

    对于投资,前面笔者写过一个文:IT人经济思维之投资 - 创业与投资系列文章 ,里面列举了笔者自己做过的投资方面的内容.今天就说说公司投资的一些思考问题. 公司投资的问题,笔者还是那句话:关键是找出适合 ...

  2. 测试库的接收到的数据是否完整（jrtplib为列）

    最近使用jrtplib来接收RTP包,然后解码播放 发现解码出来的是绿屏,马赛克 于是开始排查 首先直接用wireshark抓进来的包,转为可以被vlc播放的文件 操作如下 http://blog.c ...

  3. PHP使用google api生成二维码

    代码如下: <?php $urlToEncode="nickname:Feanmy,email:feanmy@qq.com"; generateQRfromGoogle($u ...

  4. Head First设计模式之工厂模式

    一.定义 定义了一个创建对象的接口, 但由子类决定要实例化的类是哪一个. 工厂方法让类把实例化推迟到子类 二.结构 1.抽象工厂角色:这是工厂方法模式的核心,它与应用程序无关.是具体工厂角色必须实现的 ...

  5. mybatis源码学习--spring+mybatis注解方式为什么mybatis的dao接口不需要实现类

    相信大家在刚开始学习mybatis注解方式,或者spring+mybatis注解方式的时候,一定会有一个疑问,为什么mybatis的dao接口只需要一个接口,不需要实现类,就可以正常使用,笔者最开始的 ...

  6. 固定表头，单元格td宽度自适应，多内容出现-横向纵向滚动条数据表格的<前世今生>

    固定表头,单元格td宽度自适应,多内容出现-横向纵向滚动条数据表格的<前世今生>     先上图例   & 无论多少数据--都完美! 背景:由于我司行业方向,需要很多数据报表,则t ...

  7. JS实现EasyUI ,Datagrid,合并单元格功能

    为了实现datagrid的合并单元格效果,datagrid的数据加载方式肯定是要写在JS文件内部的. 一:在JS内部添加Datagrid数据加载方法如下: $("#id").dat ...

  8. spark 1.6 完全分布式平台搭建

    软件环境: scala-2.11.4.tgz spark-1.6.2-bin-hadoop2.6.tgz 操作步骤: 一.  安装scala 1. 解压scala (tar –zxvf  filena ...

  9. Juicer模板引擎使用笔记

    关于Juicer:Juicer 是一个高效.轻量的前端 (Javascript) 模板引擎,使用 Juicer 可以是你的代码实现数据和视图模型的分离(MVC). 除此之外,它还可以在 Node.js ...

  10. mp3格式转wav格式 附完整C++算法实现代码

    近期偶然间看到一个开源项目minimp3 Minimalistic MP3 decoder single header library 项目地址: https://github.com/lieff/m ...