百度有啊前端框架分析（浏览器内置事件）

最新推荐文章于 2022-01-30 23:33:14 发布

slalx

最新推荐文章于 2022-01-30 23:33:14 发布

阅读量1.7k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签：浏览器框架百度 function javascript

本文链接：https://blog.youkuaiyun.com/slalx/article/details/4740324

javascript 专栏收录该内容

28 篇文章

订阅专栏

本文介绍了JavaScript中的事件处理机制，包括浏览器内置事件的标准化处理方法，如获取事件目标对象、判断鼠标点击类型、获取鼠标位置等，并提供了阻止默认行为及事件冒泡的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

事件是JavaScript中非常重要的一个内容，在百度有啊的前端框架中主要对事件分成了浏览器内置事件和自定义事件两部分。

BBEvent下主要对浏览器内置事件进行了标准化。

target ：事件目标对象

BBEvent.target = function(A) {
    A = A || window.event;
    return A.target || A.srcElement;
};

isLeftClick ：判断是否为鼠标左键点击

BBEvent.isLeftClick = function(A) {
    A = A || window.event;
    return (((A.which) && (A.which == 1)) || ((A.button) && (A.button == 1)));
};

pageX ：鼠标相对于整个页面的X轴的坐标

BBEvent.pageX = function(A) {
    A = A || window.event;
    return A.pageX || (A.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));
};

pageY ：鼠标相对于整个页面的y轴的坐标

BBEvent.pageY = function(A) {
    A = A || window.event;
    return A.pageY || (A.clientY + (document.documentElement.scrollTop || document.body.scrollTop));
};

pagePosition ：鼠标相对整个页面的坐标

BBEvent.pagePosition = function(A) {
    A = A || window.event;
    return {
        x: BBEvent.pageX(A),
        y: BBEvent.pageY(A)
    };
};

layerX 鼠标相对于当前元素的X坐标（当前元素要position:absolute，否则会跟pageX相同）

BBEvent.layerX = function(A) {
    A = A || window.event;
    return A.layerX || A.offsetX;
};

layerY鼠标相对于当前元素的Y坐标(当前元素要position:absolute)

BBEvent.layerY = function(A) {
    A = A || window.event;
    return A.layerY || A.offsetY;
};

layerPosition 鼠标相对于当前元素的坐标（当前元素要position：absolute）

BBEvent.layerPosition = function(A) {
    A = A || window.event;
    return {
        x: BBEvent.layerX(A),
        y: BBEvent.layerY(A)
    };
};

preventDefault 阻止浏览器默认动作的发生

BBEvent.preventDefault = function(A) {
    A = A || window.event;
    if (A.preventDefault) {
        A.preventDefault();
    } else {
        A.returnValue = false;
    }
};

stopPropagation 阻止事件冒泡

BBEvent.stopPropagation = function(A) {
    A = A || window.event;
    if (A.stopPropagation) {
        A.stopPropagation();
    } else {
        A.cancelBubble = true;
    }
};

observe 添加事件监听器

stopObserving 删除事件监听器

fireEvent 触发事件

CustEvent是对自定义事件服务的。

observe

stopObserving

fireEvent