加入收藏 | 设为首页 | 会员中心 | 我要投稿 三明站长网 (https://www.0598zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 运营中心 > 网站设计 > 教程 > 正文

fastclick 源码注解及一些基础知识点

发布时间:2016-11-02 06:12:26 所属栏目:教程 来源:站长网
导读:副标题#e# 在移动端,网页上的点击穿透问题导致了非常糟糕的用户体验。那么该如何解决这个问题呢? 问题产生的原因 移动端浏览器的点击事件存在300ms的延迟执行,这个延迟是由于移动端需要通过在这个时间段用户是否两次触摸屏幕而触发放大屏幕的功能。那么

事件触发时,哪个优先?

document.querySelector('.span-click').addEventListener('click',function(e){
  console.log("span");
},!1);
document.querySelector('.div-inside').addEventListener('click',function(e){
  console.log("inside");
},!0);
document.querySelector('.div-outside').addEventListener('click',function(e){
  console.log("outside");
},!1);
document.body.addEventListener('click',function(e){
  console.log("body");
},!1);
document.addEventListener('click',function(e){
  console.log("html");
},!1);

// 输出
/* 
 * inside
 * span
 * outside
 * body
 * html
*/

显而易见...

Event.stopPropagation 和 Event.stopImmediatePropagation

Event.stopPropagation:阻止事件向上传播(冒泡)

Event.stopImmediatePropagation:阻止该标签上的同类型事件被触发并阻止事件向上传播(冒泡)

html:

<body>
    <div class="div-outside">
        <div class="div-inside">
            a div for click
        </div>
    </div>
</body>

(编辑:三明站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读