zepto绑定事件改变冒泡事件流

bergwhite 发布于2019-08-26 12:23 / 843人阅读

摘要：如果你写操作元素不多，肯定不会认为它会改变冒泡事件流。而不是我们理解的冒泡事件，原因也是因为委托事件都依次放入一个队列里，谁在前面谁先执行。再看几个案列二以上代码就是先输出，再输出了。原因就是因为直接不影响

如果你写zepto操作DOM元素不多，肯定不会认为它会改变冒泡事件流。

Zepto 的事件委托是：

在代码解析的时候，所有document的所有 click 委托事件都依次放入一个队列里，click 的时候先看当前元素是不是.a，符合就执行，然后查看是不是.b，符合就执行。

话不多说，直接看案列：

先输出c,再输出d。而不是我们理解的冒泡事件，原因也是因为委托事件都依次放入一个队列里，谁在前面谁先执行。

再看几个案列：一

    $(function(){
         $(".a").on("click",".d", function(event) {
                console.log("a on d");
            });
        $(".a").on("click", ".c", function(event) {
            console.log("a on c");
        });
    });

以上代码？？就是先输出d，再输出c了。原因就是因为队列。

再看几个案列：二

       $(".c").on("click", function(event) {
                console.log("a on c");
            });
        $(".d").on("click",function(event) {
            console.log("a on d");
        });

以上代码？？就是先输出d，再输出c了。原因就是因为直接bind不影响

GPU云服务器云服务器冒泡事件事件冒泡事件冒泡机制阻止冒泡事件

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108587.html

窥探zepto的事件模块

摘要：写在前面通过本文，您可以了解的事件模块，之后到底发生了什么样的事情，如何实现的事件委托，如何实现的自定义事件等问题。个人理解这么做目的在于便于移除事件，这样就可以使用匿名函数，而且仍可以将该匿名函数移除。写在前面通过本文，您可以了解zepto的事件模块，$(selector).on之后到底发生了什么样的事情，如何实现的事件委托【$(selector).delegate】，如何实现的...

frolc 2019-08-21 11:18 评论0 收藏0
zepto与focus/blur与事件委派

摘要：的处理事件注册流程大致如下为了有事件冒泡以完成事件委派，一般情况下用代替在浏览器不支持的情况下，只能用在捕获阶段触发回调，间接做到事件委派。结果，就是有两个机会在目标对象上面操作事件。 showImg(https://segmentfault.com/img/bV2KEn?w=1300&h=867); --- focusin、focusout focus、blur 冒泡支持 ...

TNFE 2019-08-22 14:04 评论0 收藏0
读Zepto源码之Event模块

摘要：不支持事件冒泡带来的直接后果是不能进行事件委托，所以需要对和事件进行模拟。调用函数，分隔出参数的事件名和命名空间。这里判断是否为函数，即第一种传参方式，调用函数的方法，将上下文对象作为的第一个参数，如果存在，则与的参数合并。 Event 模块是 Zepto 必备的模块之一，由于对 Event Api 不太熟，Event 对象也比较复杂，所以乍一看 Event 模块的源码，有点懵，细看下...

vpants 2019-08-20 18:06 评论0 收藏0
2018 浅谈前端面试那些事

摘要：声明的变量不得改变值，这意味着，一旦声明变量，就必须立即初始化，不能留到以后赋值。虽然今年没有换工作的打算但为了跟上时代的脚步还是忍不住整理了一份最新前端知识点知识点汇总 1.HTML HTML5新特性，语义化浏览器的标准模式和怪异模式xhtml和html的区别使用data-的好处meta标签canvasHTML废弃的标签IE6 bug，和一些定位写法css js放置位置和原因...

LiuRhoRamen 2019-08-30 14:11 评论0 收藏0
2018 浅谈前端面试那些事

摘要：声明的变量不得改变值，这意味着，一旦声明变量，就必须立即初始化，不能留到以后赋值。虽然今年没有换工作的打算但为了跟上时代的脚步还是忍不住整理了一份最新前端知识点知识点汇总 1.HTML HTML5新特性，语义化浏览器的标准模式和怪异模式xhtml和html的区别使用data-的好处meta标签canvasHTML废弃的标签IE6 bug，和一些定位写法css js放置位置和原因...

stormgens 2019-08-22 15:34 评论0 收藏0