js 判断鼠标是单击还是双击

<button onmousedown="abc();">test</button>

<script >

j=0;

function abc(){

clock=null;

j++;

if (j>=2){alert('dblclick');j=0;return 0}

clock= setTimeout(function(){if(j=1)alert("click");},150)

}

</script>

你凑活试下！多测试的话，这段代码会出问题！

setTimeout 和setInterval偶尔还是会出问题

所以最好是避免在同一个按钮上同时实现单击双击事件！其实很多时候都没这个必要！

如果你说的不同元素的话，onclick,ondblclick就行了！

onclick是单击事件，ondbclick是双击事件，这两个不冲突的好吧。最简单的，你设置单击事件的延时，在时间内再次单击就是双击事件，屏蔽掉单击；若是在时间内没有再点击，就做单击事件处理

onClick鼠标点击事件，多用在某个对象控制的范围内的鼠标点击onDblClick 鼠标双击事件onMouseDown 鼠标上的按钮被按下了onMouseUp 鼠标按下后，松开时激发的事件onMouseOver当鼠标移动到某对象范围的上方时触发的事件onMouseMove 鼠标移动时触发的事件onMouseOut 当鼠标离开某对象范围时触发的事件

① 首先，JavaScript事件中是有双击事件的：就是 ondblclick；

② 例子：

var div = documentgetElementById("box");

divaddEventListener("dblclick", function() {

……

});

或者

divondblclick = function() {

……

};

以上都是匿名函数的写法。

简单的示例   div的背景色 会随着鼠标进入变红 离开变白 点击 变绿  双击变蓝

var divs = documentgetElementsById('div1');

    divsonmouseover = function(){

        thisstylebackground = 'red'

    }

    divsonmouseout = function(){

        thisstylebackground = ''

    }

    divsonclick = function(){

        thisstylebackground = 'green'

    }divsondblclick = function(){

       thisstylebackground = 'blue'

   }

代码要写在  windowonload ()  或者  documentonready()

首先你查看一下js错误，movediv()未定义，然后查看一下源文件就明白是怎么回事了，documentwrite将重新生成HTML源码，以前的代码已经丢失，所以我给你改写了一下；还有“thismovediv()“的“this“是错误的，去掉；修改后的代码如下，希望对你有用：amp;lt;htmlamp;gt;nbsp;amp;lt;headamp;gt;nbsp;amp;lt;scriptamp;gt;nbsp;functionnbsp;display()nbsp;{nbsp;varnbsp;ss=“amp;lt;tablenbsp;name=‘tabframe‘align=‘center‘nbsp;style=‘text-align:center;background-color:green;‘amp;gt;“;ss+=“amp;lt;tramp;gt;amp;lt;tdamp;gt;amp;lt;inputnbsp;type=buttonnbsp;style=‘color:red;width:200;height:100;border:1pxnbsp;solidnbsp;#111111‘nbsp;value=‘div留言‘nbsp;onclick=documentgetElementById(‘divframe‘)styledisplay=‘block‘amp;gt;amp;lt;/tdamp;gt;amp;lt;/tramp;gt;amp;lt;/tableamp;gt;“;ss+=“amp;lt;divnbsp;id=‘divframe‘nbsp;style=‘width:500px;height:100px;display:none;position:absolute;background-color:#dddddd;top:200;left:200;‘amp;gt;“;ss+=“amp;lt;tablenbsp;align=‘center‘nbsp;border=1nbsp;style=‘text-align:center;border:1pxnbsp;solidnbsp;#aaaaaanbsp;‘amp;gt;“;ss+=“amp;lt;tramp;gt;amp;lt;tdnbsp;style=‘text-align:center;‘amp;gt;amp;lt;spannbsp;onclick=movediv();amp;gt;我的显示信息amp;lt;/spanamp;gt;amp;lt;/tdamp;gt;amp;lt;/tramp;gt;“;ss+=“amp;lt;tramp;gt;amp;lt;tdamp;gt;文字amp;lt;/tdamp;gt;amp;lt;/tramp;gt;“;ss+=“amp;lt;tramp;gt;amp;lt;tdamp;gt;amp;lt;spannbsp;style=‘cursor:hand;‘nbsp;onclick=documentgetElementById(‘divframe‘)styledisplay=‘none‘amp;gt;[关闭]amp;lt;/tdamp;gt;amp;lt;/tramp;gt;“;ss+=“amp;lt;/tableamp;gt;“;ss+=“amp;lt;/divamp;gt;“;windowdocumentbodyinnerHTML+=ss;/documentwrite(“amp;lt;tablenbsp;name=‘tabframe‘align=‘center‘nbsp;style=‘text-align:center;background-color:green;‘amp;gt;“);nbsp;documentwrite(“amp;lt;tramp;gt;amp;lt;tdamp;gt;amp;lt;inputnbsp;type=buttonnbsp;style=‘color:red;width:200;height:100;border:1pxnbsp;solidnbsp;#111111‘nbsp;value=‘div留言‘nbsp;onclick=documentgetElementById(‘divframe‘)styledisplay=‘block‘amp;gt;amp;lt;/tdamp;gt;amp;lt;/tramp;gt;amp;lt;/tableamp;gt;“);nbsp;documentwrite(“amp;lt;divnbsp;id=‘divframe‘nbsp;style=‘width:500px;height:100px;display:none;position:absolute;background-color:#dddddd;top:200;left:200;‘amp;gt;“);nbsp;documentwrite(“amp;lt;tablenbsp;align=‘center‘nbsp;border=1nbsp;style=‘text-align:center;border:1pxnbsp;soli

前言：有些事情看上去简单甚至于平淡无奇，比如说爱情或者我们的生活可实际上却很复杂。js里面的event也是一样，不信就打印一下一个平淡无奇的onclick里面包含的event，只要在方法内传入参数event，或者e，还有ev然后打印，你就会发现一个新的天地。

核心内容：多种事件的运用场景解析

开始了

1吹牛逼

2吹牛逼

3也许我别来，你自然无恙

A：复杂多样的鼠标事件

应用：鼠标事件很多，平时用个点击就以为用过那就大错特错了，鼠标事件不仅有原生的点击，双击，移动，进入，移出，悬浮，可以打印event里面的type查看，还有一些比如jq封装的事件，这些事件而且会相互触发，比如移动move是最容易被其他事件触发，或者原生的拖拽事件，不仅有自己的事件，而且会触发元素上的很多其他事件。

B：为什么会这样呢？

解析：第一本身不同事件类型但是相近的鼠标 *** 作就会同时触发，第二在多层dom结构中的事件，由于本身事件的冒泡机制，由最底层的元素向上冒泡，到父元素到document到window，以至于类似事件不同方法但是同时触发

C：怎么解决

办法：比如现象一：只想触发最底层的元素的点击事件，不触发其父元素的点击事件，解决方案阻止冒泡。现象二：类型相近事件相互触发，导致方法重复执行，解决方案在易促发的事件的方法中可以加入条件判断，是否已经执行过相同 *** 作，如果有要么直接return，如果还有其他 *** 作判断，可以将可能重复的那个 *** 作进行重置。现象三：原生方法事件以及简单事件相互交叉影响导致最后鼠标事件失灵，定义的方法不能执行，页面不可控制，解决方案单个功能实现后进行方法设为null如domonclick=null，然后设置dom对象释放捕获。

event事件实在太多太复杂了，正如人生一样，可是有时候多一点细心多一点耐心，没事多打打断点和测试，我们会看得更加清晰，正如我若别来，你自然无恙，越是纠结，越是沉沦，往往简单最好。

事件人生，人生事件，简单复杂，复杂简单，一正一反，经历了自然会成长，花香了自然蝶飞舞。

以上就是关于js 判断鼠标是单击还是双击全部的内容，包括:js 判断鼠标是单击还是双击、怎么用JS实现鼠标单击与双击事件共存、JavaScript中类似于onClick的事件等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！