event_5:常用鼠标事件 + MouseEvent对象

常用鼠标事件

onclick          当用户点击某个对象时调用的事件句柄。    2
oncontextmenu    在用户点击鼠标右键打开上下文菜单时触发     
ondblclick       当用户双击某个对象时调用的事件句柄。    2
onmousedown      鼠标按钮被按下。    2
onmouseenter     当鼠标指针移动到元素上时触发。    2
onmouseleave     当鼠标指针移出元素时触发    2
onmousemove      鼠标被移动。    2
onmouseover      鼠标移到某元素之上。    2
onmouseout       鼠标从某元素移开。    2
onmouseup        鼠标按键被松开。

1)禁止鼠标右键菜单

document.oncontextmenu = function (e) {
    e.preventDefault();
}

2)禁止鼠标选中文字

document.onselectstart = function (e) {
    e.preventDefault();
}

二  鼠标事件对象

document.onclick = function (e) {
    //(1) 鼠标距离 可视区 的X坐标和Y坐标
    console.log(e.clientX);
    console.log(e.clientY);
    console.log('------------------------');

    //(2) 鼠标距离 页面文档 的X坐标和Y坐标 [最常用]
    console.log(e.pageX);
    console.log(e.pageY);
    console.log('========================');

    //(3) 鼠标距离 显示器 的X坐标和Y坐标 [加了浏览器的]
    console.log(e.screenX);
    console.log(e.screenY);
}

 

posted @ 2021-02-24 18:13  棉花糖88  阅读(471)  评论(0编辑  收藏  举报