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

　　在用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. Mysql 索引优化分析

    MySQL索引优化分析 为什么你写的sql查询慢?为什么你建的索引常失效?通过本章内容,你将学会MySQL性能下降的原因,索引的简介,索引创建的原则,explain命令的使用,以及explain输出字 ...

  2. Android 内存暴减的秘密？！

    作者:杨超,腾讯移动客户端开发 工程师  商业转载请联系腾讯WeTest获得授权,非商业转载请注明出处. WeTest 导读 在我这样减少了26.5M Java内存! 一文中内存优化一期已经告一段落, ...

  3. Extjs入门-grid

    function rowdblclickFn(grid, rowIndex, e){//双击事件              var row = grid.store.getById(grid.stor ...

  4. 记一次Hbase查询速度优化经历

    项目背景: 在这次影像系统中,我们利用大数据平台做的是文件(图片.视频等)批次的增删改查,每个批次都包含多个文件,上传完成以后要添加文件索引(文件信息及批次信息),由于在Hbase存储的过程中,每个文 ...

  5. jQuery 选择器 （一）

    选择器 实例 选取 * $("*") 所有元素 #id $("#lastname") id="lastname" 的元素 .class $( ...

  6. 深入研究ES6 Generators

    ES6 Generators系列: ES6 Generators基本概念 深入研究ES6 Generators ES6 Generators的异步应用 ES6 Generators并发 如果你还不知道 ...

  7. [代码审计]青云客Cms前台有条件注入至getshell，后台xss至getshell、至弹你一脸计算器

    之前写了一篇关于青云客cms的文章,发在了t00ls,就不copy过来了. 给个链接,好记录一下. https://www.t00ls.net/thread-43093-1-1.html

  8. Ftplib模块的用法

    login(user='',passwd='', acct='') 登录到FTP 服务器,所有的参数都是可选的 pwd() 当前工作目录 cwd(path) 把当前工作目录设置为path dir([p ...

  9. struts实现文件上传和下载。

    先来实现上传. 写上传不管语言,都要先注意前端的form那儿有个细节. <form name="form1" method="POST" enctype= ...

  10. centos下卸载OpenJDK 并安装sun的jdk

    centos下卸载OpenJDK 并安装sun的jdk 第一步:查看并卸载CentOS自带的OpenJDK 安装好的CentOS会自带OpenJdk,用命令 java -version ,我这里显示下 ...