事件捕获与冒泡

261 阅读1分钟

冒泡

像水一样,从下往上冒泡。事件由第一个触发,逐级向上传递。

/**
 * param 第一个参数event是要执行的事件
 * 第二个参数fn是事件要执行的函数
 * 第三个参数flag默认是false,表示在事件冒泡阶段调用事件处理函数;
 * 如果参数为true,则表示在事件捕获阶段调用处理函数。
 */
 
ele.addEventlistener(event, fn, false) }

阻止事件冒泡

function stopBubbling(e) {
    var e = e || window.event;
    if(e && e.stopPropagation){
        e.stopPropagation();
    }else{
        // 兼容IE8写法
        e.canceBubble = true;
    }
}

捕获

和冒泡刚好相反,事件由第一个触发,逐级向下传递;

ele.addEventlistener(event, fn, true) }

阻止事件捕获


function stopCatch(e) {
    var e = e || window.event;
    if(e && e.preventDefault){
        e.preventDefault();
    }else{
        e.returnValue = true;
    }
    return false;
}