javascript双击事件取消默认的两次单击事件
当一个元素同时具有单击和双击事件时，双击时会触发2次单击和1此双击事件。
双击会：先第1次单击 ，同时触发第2次和双击事件。
造成的不好影响：每次单击事件会延迟执行。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript">
var id;
window.onload = function () {
document.getElementById('divdemo').onclick = function () {
//清除的是双击事件的第2次单击事件id
clearTimeout(id);//这句代码放setTimeout下面，也同样将下面的定时器关掉。
id = setTimeout(function () {//不论单双击，每点击一次就会立马产生一个定时器id，产生的id和这个定时器执行与否（什么时候执行）没有关系。
alert(id);//单击操作
}, 300);
//clearTimeout(id);
}
document.getElementById('divdemo').ondblclick = function () {
//清除的是双击事件的第1次单击事件id
clearTimeout(id);
alert(id);//双击操作
}
}
</script>
</head>
<body>
<div id="divdemo" style="width: 400px; height: 400px; background-color: red">
</div>
</body>
</html>
只有单击，
<script type="text/javascript">
var id;
window.onload = function () {
document.getElementById('divdemo').onclick = function () {
//清除的是双击事件的第2次单击事件id
//clearTimeout(id);//这句代码放setTimeout下面，也同样将下面的定时器关掉。
id = setTimeout(function () {//不论单双击，每点击一次就会立马产生一个定时器id，产生的id和这个定时器执行与否（什么时候执行）没有关系。
alert(id);//单击操作
}, 300);
clearTimeout(id);//只有单击时，只能放这，才会让单击事件不执行
}
}
</script> <body>
<div id="divdemo" style="width: 400px; height: 400px; background-color: red">
</div>
</body>
javascript双击事件取消默认的两次单击事件的更多相关文章
- Angular JS中双击事件ng-dblclick避免同时触发两次单击事件ng-click的解决方案
有些需求中,需要一个元素上既有双击事件,也有单击事件,而两者实现的效果不一样. 这时可以使用ng-dblclick与ng-click来实现需求,但是要避免浏览器将双击事件误认为是两次单击事件,从而出现 ...
- jQuery 双击事件（dblclick）时，不触发单击事件(click)
我这是转载的文字 原文地址:http://www.cnblogs.com/wyblog/archive/2011/12/15/2289219.html 万恶的双击事件啊!! 在jQuery的事件绑定中 ...
- JQuery如何实现双击事件时不触发单击事件
单击和双击事件的执行顺序: 单击(click):mousedown,mouseout,click: 双击(dblclick):mousedown,mouseout,click , mousedown, ...
- [转]jQuery 双击事件（dblclick）时，不触发单击事件(click)
例1: 链接:http://www.w3school.com.cn/jquery/event_dblclick.asp HTML 系列教程 浏览器脚本 服务器脚本 ASP.NET 教程 XML 系列教 ...
- jquery双击事件会触发单击事件
实际工作中,我们经常会遇到在同一个元素上,绑定多种事件类型,比较常见的是单击事件和一些鼠标事件,一般而言影响不大.但是如果同时绑定单击事件和双击事件呢? 其实,只要能够想明白的话,解决方案也比较简单, ...
- 一个取消事件的简单js例子(事件冒泡与取消默认行为)
先上代码: <div id='outer' onclick='alert("我是outer")'> <div id="middle" oncl ...
- JQuery如何实现双击事件时不触发单击事件，解决鼠标单双击冲突问题
在jQuery的事件绑定中,如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时,不会触发双击事件(dblclick), 执行双击事件(dblcli ...
- JS中双击和单击事件冲突解决
在JS中代码中同一功能块中通常同时会用到单击.双击事件,但通常会遇到一个问题,就是在双击的时候即执行了一次双击事件,而且还执行了两次单击事件.此类冲突在ZTree.DHTMLX中经常遇到. 想要解决两 ...
- GridView中添加行单击事件.md
[toc] 1.使用说明 1.方法来源 该方法主要参考StackOverflow上面的答案和下面这篇文章 http://www.codeproject.com/Articles/15677/Click ...
随机推荐
- 如何手动修改XP系统属性中的技术支持信息
\windows\system32目录下有个oeminof.ini,里面是OEM显示的文字信息,把相应项目修改即可,OEM图片使用的是本目录下的OEMlogo.bmp(图片:创建一个图形文件,像素尺寸 ...
- 电话连线（codevs 1003）
题目描述 Description 一个国家有n个城市.若干个城市之间有电话线连接,现在要增加m条电话线(电话线当然是双向的了),使得任意两个城市之间都直接或间接经过其他城市有电话线连接,你的程序应该能 ...
- 考前复习(codevs 2837)
2837 考前复习 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 题目描述 Description Aiden马上要考试了,可他 ...
- javascript reduce map函数方法
retduce: 对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供. 语法 array1.reduce(callbackfn ...
- IntelliJ IDEA快捷键和常用设置
一 快捷键的使用 1.文本编辑删除 ctr + y复制 ctr + D2.智能提示提示 ctr + space智能提示 ctr + shift + space完成当前语句 ctr + ...
- PHPExcel 类
//引入工具类 require_once 'PHPExcel.php'; //HandleExcel.class.php 文件 class HandleExcel extends PHPExcel{ ...
- AutoCompleteTextView自动填充文本
布局: <AutoCompleteTextView android:id="@+id/auto" android:layout_width="match_paren ...
- 简单几何(圆与多边形公共面积) UVALive 7072 Signal Interference (14广州D)
题目传送门 题意:一个多边形,A点和B点,满足PB <= k * PA的P的范围与多边形的公共面积. 分析:这是个阿波罗尼斯圆.既然是圆,那么设圆的一般方程:(x + D/2) ^ 2 + (y ...
- C# 同步/并发队列ConcurrentQueue
如下所示,ConcurrentQueue做到了代码的简化,在并发模型中充当同步对象 private ConcurrentQueue<string> inQueue = new Concur ...
- POJ3687 Labeling Balls（拓扑排序\贪心+Floyd）
题目是要给n个重量1到n的球编号,有一些约束条件:编号A的球重量要小于编号B的重量,最后就是要输出字典序最小的从1到n各个编号的球的重量. 正向拓扑排序,取最小编号给最小编号是不行的,不举出个例子真的 ...