mousedown和click冲突事件
鼠标事件,一般用button来区分鼠标的按键(DOM3标准规定: click事件只能监听左键, 只能通过mousedown和mouseup来判断鼠标键):
1.鼠标左键 button = 0
2.鼠标右键 button = 2
3.鼠标滑轮 button = 1
div.onmousedown = function (e) {
var event = e || window.event;
if(event.button == 2){
console.log('right');
}else if(event.button == 0){
console.log('left');
}
}
解决mousedown和click的之间的冲突 (利用事件发生时间来判断 点击事件时间短)
var key = false;//设置了一个标志 false为点击事件 ture为鼠标移动事件
var firstTime = 0;
var lastTime = 0;
div.onclick = function() {
if(key){
console.log('click');
key = false;
}
}
div.onmousedown = function() {
firstTime = new Date().getTime();
console.log('mouseDown');
}
div.onmouseup = function() {
console.log('mouseUp');
//鼠标抬起后 记录时间 超过200ms就是移动事件
lastTime = new Date().getTime();
if( (lastTime - firstTime) <){
key = true;
}
}
mousedown和click冲突事件的更多相关文章
- 快速解决js开发下拉框中blur与click冲突
在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦 ...
- 下拉框选择blur与click冲突问题
缘由:今天在做下拉框选择时,遇到click和blur冲突问题:具体现象如下 1.intput框获取焦点(focus事件)时显示隐藏的下拉框,失去焦点(blur事件)则隐藏下拉框 2.点击选择(clic ...
- 点击div和某些控件之外的地方隐藏div,点击div不隐藏。对象 click和document click冲突有关问题
帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学! 问题背景:jQuery事件问题! ...
- jquery click嵌套 事件重复注册 多次执行的问题
jquery click嵌套 事件重复注册 多次执行的问题 上面只是参考,我自己的解决方法是先使用unbind("click")解除事件然后再绑定新事件: $("#tes ...
- input元素的blur事件与定位在其上面的元素的点击(click)事件冲突的解决方法
在登录和注册框中,在input上定位一个清空内容的按钮. 但是给按钮的单击事件不生效. 解决的办法: 在blur的回调函数中加一个定时器,延迟blur回调函数的执行时间,这样的话虽然在点击div的时候 ...
- 解决移动端touch事件与click冲突的问题
最简单的办法,就只绑定一个事件不就行了: 第二种,我觉得和第一种也没啥区别.. const Button = document.getElementById("targetButton&qu ...
- mousedown\mouseup\click事件关系
背景分析: 如果用户在一个元素上点击,那么最少三个事件会被触发,事件发生顺序: 1.mousedown,当用户在这个元素上按下鼠标键的时候 2.mouseup,当用户在这个元素上松开鼠标键的时候 3. ...
- 关于JS 事件冒泡和onclick,click,on()事件触发顺序
今天在给JQgrid中的标签添加click事件的时候,发现一个问题. JQgrid的table中,点击任何位置,都会勾选点击行的checkbox,而我希望在点击我的标签的时候,不要勾选checkbox ...
- 原生andriod浏览器回退后dom(click)事件全体失效问题探究
问题描述 今天同事遇到一个神一样的BUG: 在原生浏览器下,为dom元素绑定一个click事件,其中有个a标签外链,点击a后进入其他页面,点击浏览器后退后,页面点击事件全体失效! 我于是用ios测了下 ...
随机推荐
- codis3.2安装报错dashboard.go:369: [PANIC] call rpc create-proxy to dashboard 127.0.0.1:18080 failed的处理
codis3.2安装报错dashboard.go:369: [PANIC] call rpc create-proxy to dashboard 127.0.0.1:18080 failed的处理 执 ...
- Fragment与Acitvity通信
Fragment与Activity通信的方式如下: 一.通过初始化函数提供 1.在动态添加Fragment的过程中,我们在Activity中通过Fragment.setArguments()的方法为F ...
- Light OJ 1009
题意: 给你一个二分图, (可能不连通) 求可能多的子集元素个数: 思路: 直接DFS 给二分图染色就有了, 统计联通块中个数, 去最大值相加即可. #include<bits/stdc++.h ...
- Java中instanceof与getClass的区别
在比较一个类和另一个类是否属于同一个类实例的时候,通常可以采用instanceof和getClass两种方法比较两者是否相等来判断,但是两者在判断上面是有差别的,下面通过代码说明: public cl ...
- [PHP]flock文件IO锁的使用
一.flock概述 bool flock ( resource $handle , int $operation [, int &$wouldblock ] ) 参数 handle 文 ...
- android7.0以上使用融云即使通讯的坑
一.连接服务器不走connect()方法 在android6.0以下,在使用融云sdk时,直接将依赖库引入到项目中即可.但是在7.0及以上时,直接应用会发现消息一直发送不出去,错误提示为dlopen ...
- Java、Apache Tomcat下载与安装及环境变量配置
1.Java JDK 与 Apache Tomcat 下载 JDK 下载 Apache Tomcat 下载 2.安装与环境变量配置 关于 JDK 的安装挺简单的,网上教程也挺多,Tomcat 下载免安 ...
- Confluence 6 从一个备份中获得文件附件
页面中的文件附件可以从备份中获得而不需要将备份文件导入到 Confluence 中.这个在用户删掉了附件,但是你还是想恢复这个附件的时候就变得非常有用了. 自动备份和手动备份都允许你进行这个操作,但是 ...
- AFN 请求报 415错误解决方案
使用 AFHTTPSessionManager 发起请求时 设置下面两句代码 manager.requestSerializer = [AFJSONRequestSerializer seriali ...
- DIY电源拓扑线
记一些小事. 一.材料及工具:电源座DC-005.热熔胶.废弃PCB.锡线.导线.电烙铁.热风枪(或打火机.热熔胶枪) 二.使用热熔胶将电源座粘在一起.两个电源座之间垫一块废弃的PCB,防止两者距离过 ...