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测了下 ...
随机推荐
- virtual box 安装centos min
2018-4-19 22:20:40 星期四 之前不小心把用了很久的centos镜像删掉了.....这里记录下安装最小版centos的步骤 1. 安装centos 2. 开启网络, 并设置为随机启动 ...
- 获得小程序码getWXACodeUnlimit
报错47001 data format error 出现这个错误必须是Body里面的raw才可以,而且access_token参数必须写在地址后面,不能写在raw里面,不然也出错. /** * 生命周 ...
- 硬盘性能测试工具fio
如何衡量云硬盘的性能 IOPS:每秒读/写次数,单位为次(计数).存储设备的底层驱动类型决定了不同的 IOPS. 吞吐量:每秒的读写数据量,单位为MB/s. 时延:IO操作的发送时间到接收确认所经过的 ...
- Windows上的程序员神器Cmder
用过Windows版本Git的都知道Git自带了Git Bash,这个在很大程度上满足了我的需求,随着Git的版本升级越来越好用 安装Cmder Cmder官网,它把conemu,msysgit和cl ...
- js 对象的循环
var car = {type:"Fiat", model:500, color:"white"}; var arr = array(); for(i in c ...
- vscode开发c#
转载自: http://www.cnblogs.com/lxhbky/p/6673230.html http://www.cnblogs.com/lxhbky/p/6692065.html 一.环境安 ...
- Confluence 6 针对你的数据库类型确定校验 SQL
不同的数据库通常要求不同的 SQL 校验查询.校验查询通常需要尽可能的简单,这个查询在链接从数据库连接池中取出的时候都会被执行一次. 针对不同的数据库类型,我们推荐先的校验查询 SQL: MySQL ...
- 【Java】SpringBoot配置文件读取中文乱码
[问题]在配置文件application.properties中配置一个值含有中文的变量.spring加载配置之后,读取的变量中文部分出现乱码.根据CSDN说的一堆办法,改encoding为UTF-8 ...
- Executor多线程框架使用
在我们的JDK1.5的时候JAVA推出一款为了更加方便开发的多线程应用而封装的框架(Executor),相比传统的Thread类,Executor更加的方便,性能好,更易于管理,而且支持线程池.一般在 ...
- LeetCode(65):有效数字
Hard! 题目描述: 验证给定的字符串是否为数字. 例如:"0" => true" 0.1 " => true"abc" =& ...