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) < 200){
        key = true;
    }
}
时间: 2024-10-29 19:06:28

mousedown和click冲突事件的相关文章

快速解决js开发下拉框中blur与click冲突

在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦点时触发blur事件:其为表单事件,blur和focus事件不会冒泡,其他表单事件都可以.click事件:当点击元素时触发click事件:所有元素都有此事件,会产生冒泡. 示例1:blur事件为表单事件 1 2 3 4 5 6 7 8 9 10 11 12 13 <input type="te

下拉框选择blur与click冲突问题

缘由:今天在做下拉框选择时,遇到click和blur冲突问题:具体现象如下 1.intput框获取焦点(focus事件)时显示隐藏的下拉框,失去焦点(blur事件)则隐藏下拉框 2.点击选择(click事件)下拉框内容时获取值,然后intput失去焦点(blur事件)隐藏下拉框 3.发现click事件无效,blur事件会优先于click事件执行,导致click事件无效 解决:使用mousedown替换click使点击选择事件优先执行 mousedown事件:当鼠标指针移动到元素上方,并按下鼠标按

点击div和某些控件之外的地方隐藏div,点击div不隐藏。对象 click和document click冲突有关问题

帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学! 问题背景:jQuery事件问题!!对象 click和document click冲突问题 我想点击某个元素显示一个对象, 点击页面任意处,隐藏这个对象 //点击look对象,显示隐藏mydiv $("#look").bind("click", function () {      $("#m

input type为checkbox或radio时的click默认事件

在input中,如果type为checkbox或radio时,浏览器会将该input渲染成为系统的单选或多选组件,如果这时,我们在这个input上绑定click事件,那就要小心谨慎使用e.preventDefault()这个方法(jQuery中整合了这个方法使得它能够兼容去掉浏览器中的默认事件).之所以要说谨慎使用,就是,如果你在这个事件的响应程序中判断该checkbox是否选中时,得到的结果和真正的选中状态会有所不同.下面先从一个简单的示例说明这个现象.(为了简单起见,我使用了jquery,他

shell脚本执行冲突事件-ssh&while

今天发现一个问题: 先看下脚本内容: [email protected]/0 # cat !$ cat /tmp/test_nginx ls *.txt | tr ' ' '\n' | while read line do  echo $line if [ 'yes' == 'yes' ] then ssh  192.168.109.10 "echo 'yes'" else ssh 192.168.109.10 "echo 'no'" fi done 上面脚本很简单

jquery click嵌套 事件重复注册 多次执行的问题解决

jquery click嵌套 事件重复注册 多次执行的问题解决 转载自新浪博客:http://blog.sina.com.cn/s/blog_4f925fc30100ln1o.html jquery click事件中嵌套click会重复注册内部的click事件,导致重复执行. 比如 $(...).click(function(){   $(...).click(function(){     ...//多次执行    }); });解决方法一: 每次执行完了,解除绑定,如$(...).click

对事件委托绑定click的事件的解绑

大家都知道解绑事件的jquery写法,很简单: $("xxx").unbind("click"); 然后对于事件委托式的事件绑定,亲测,这种解绑方法是无效的, $(".sideNav>ul").on("click", function (e) {     alert("aaa"+$(e.tagert).index()); } 即使做判断让一部分带有某个class的li标签的ul解绑click,依然无效

jquery 为未来添加的元素创建事件(click等事件)

$('.msgWrap').on('click','#delTable',function(){ var num = $(this).next('.number').val(); $('#inputDiv'+num).remove(); }); 注: 1.".msgWrap"为父元素class名 2."click"为绑定的事件 3."#delTable"为未来添加的元素的id名 4.function方法体内的this为"#delTabl

移除jQuery绑定的click历史事件

事件原由: function promptImage(obj,callback){  console.log(obj.a)  $('#showImage').modal({backdrop:false}).on('hidden.bs.modal', function (e) {    $('#showImage').modal('hide')  })      .find('.submit').click(function(event){        $("#showImage").