JavaScript事件之鼠标、键盘、文本操作事件

最新推荐文章于 2022-05-06 21:16:59 发布

芬贝

最新推荐文章于 2022-05-06 21:16:59 发布

阅读量452

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/qq_45027204/article/details/105495973

版权

事件分类

鼠标事件
键盘事件
文本操作事件

鼠标事件

click、mousedown、mousemove、mouseup、contextmenu、mouseover、mouseout
mouseover 鼠标移进区域 mouseout 鼠标移出区域
用button来区分鼠标的按键，0/1/2
DOM3标准规定:click事件只能监听左键,只能通过mousedown 和 mouseup来判断鼠标右键
鼠标事件全小写 οnclick=mousedown + mouseup
移动端鼠标事件 touchstart tuchmove touchend

深度理解实例1——解决mousedown和click的冲突

这段代码显示的效果是：当你正常点击鼠标左键时触发click事件，当你长按鼠标左键时并不会触发click事件

var firstTime = 0;
    var lastTime = 0;
    //相当于一个开关
    var key = false;
    div.onmousedown = function(){
   
        firstTime = new Date().getTime();
    }
    div.onmouseup = function(){
   
        lastTime = new Date().getTime();
        //小于一定的时间范围（这里假设为300ms）就说明它触发了onclick事件
        if(lastTime - firstTime < 300){
   
            key = true