1、场景:需要写一个弹出框来容纳登录界面,类似于百度的登录框

   问题:使用  display: none/block  进行弹出框的显示和隐藏,设立点击事件   onclick  进行触发,但是点击过后目标框闪烁了一下就消失        了

  解决:在调用函数后加上 "return: false;"  即可解决。看图 ↓

  如果还没解决,看看你是否给需要显示的元素包裹了父元素!

2、场景:一个按钮或者链接上方覆盖了另一层元素,导致下层按钮无法被点击

   解决:首先会先到 z-index 来解决,但是z-index 有时候并不好使,我们还有更简单的做法  pointer-events: none;

   将某个元素 pointer-events的值设置为 none ,那么该元素将不会捕获任何click事件,即不会成为鼠标事件的target。而是让事件穿过该元素到达下面的元素!即可解决上述问题。pointer-events的值只有两个我们能用到 即 auto(默认) 、none 。其他值只能用在SVG上,因为人家本来就是SVG的属性啊。看图

3、场景:设置一个按钮或者span等元素添加点击事件,频繁点击会出现蓝色背景,看图

  解决:1、 JS方法  document.onselectstart=new Function("return false");

     2、CSS方法body{} 添加以下代码:

    -webkit-user-select:none; 
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;

点击事件target的更多相关文章

  1. 从获取点击事件根元素谈 target和currentTarget

    事情由来: 写了一个点击事件,想获取根元素,想的直接用current就行了,因为之前就是这么用的,但是之前的点击元素是没子元素的,current就是根元素,但是这次点击元素内部有子元素,current ...

  2. [转]iOS Safari 中click点击事件失效的解决办法

    iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素 ...

  3. ios h5 app avalon tap点击事件失效及点击延迟300ms问题解决方法

    1.ios h5 app avalon tap事件失效 使用MUI制作app界面,使用avalon.js渲染数据,发现在(Android上正常)ios上运行时容器div的avalon的ms-on-ta ...

  4. 【Swift 2.1】为 UIView 添加点击事件和点击效果

    前言 UIView 不像 UIButton 加了点击事件就会有点击效果,体验要差不少,这里分别通过自定义和扩展来实现类似 UIButton 的效果. 声明 欢迎转载,但请保留文章原始出处:) 博客园: ...

  5. iOS Safari 中click点击事件失效的解决办法

    问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document  ...

  6. jQuery触发a标签点击事件-为什么不跳转

    今天开发发现 使用jQuery触发a标签的点击事件,当前的样式发生了变化,可是没有跳转,为什么? 百度后找到的解决方案: <a onclick="hanle()" href= ...

  7. js触发按钮点击事件

    js触发按钮点击事件 博客分类: javascript   模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...

  8. Atitit vod click event design flow  视频点播系统点击事件文档

    Atitit vod click event design flow  视频点播系统点击事件文档 重构规划1 Click cate1 Click  mov4 重构规划 事件注册,与事件分发管理器分开 ...

  9. CSS实现点击事件及实践

    实现原理利用:target,把a标签自身的href以及id设置成一样的. 案例1:实现元素的切换 HTML: <div id="box"> <a href=&qu ...

随机推荐

  1. workman项目设置开机自启动

    https://blog.csdn.net/xxq929604980/article/details/78558317 http://man.linuxde.net/chkconfig 1.脚本编写 ...

  2. windows----------如何修改windows服务器远程端口

    远程连接并登录到 Windows 实例. 选择开始 > 运行,输入 regedit 打开注册表编辑器. 查找 HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSe ...

  3. HDU 1160

    FatMouse believes that the fatter a mouse is, the faster it runs. To disprove this, you want to take ...

  4. Dom4j基础

    dom4j是一个非常非常优秀的Java XML API,用来读写XML文件,具有性能优异.功能强大和易于使用的特点,同时它也是一个开放源代码的软件,可以在SourceForge上找到它.对主流的Jav ...

  5. 收银台数据库存储AES加解密

    高级加密标准(AES,Advanced Encryption Standard)为最常见的对称加密算法加密和解密用到的密钥是相同的,这种加密方式加密速度非常快,适合经常发送数据的场合.缺点是密钥的传输 ...

  6. Dockfile基本语法

    FROM 功能为指定基础镜像,并且必须是第一条指令. 如果不以任何镜像为基础,那么可写为:FROM scratch. 接下来所写的指令将作为镜像的第一层开始. 格式: FROM <image&g ...

  7. topcoder srm 560 div1

    problem1 link 从大到小贪心,较大的数字应该放置在较浅的位置. problem2 link 最后的位置要么都是整数(经过偶数次变换),要么是$(p.5, q.5)$这种位置(奇数次变换). ...

  8. Vue提供操作DOM的方法

    <div ref="wrapper"> Vue.js 提供了我们一个获取 DOM 对象的接口—— vm.$refs.在这里,我们通过了 this.$refs.wrapp ...

  9. 通过修改DNS达到不FQ也能访问Google(2018-12-25至现在已失效)

    一.前言 不知道各位小伙伴们现在用的搜索引擎是用Google搜索还是百度搜索呢?但我个人还是比较极力推荐用Google搜索的,首先用百度搜索后的结果的前几项大部分是满屏的广告,甚至搜索的结果并不能直接 ...

  10. 《Visual C# 从入门到精通》第二章方法和作用域——读书笔记

    第2章 方法和作用域 2.1创建方法 方法是一个基本的,强大的编程机制.可视为函数或者子程序相似的东西. 方法名是个有意义的标识符. 方法主体包含方法被调用时实际执行的语句. 声明一个方法的实例如下: ...