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 ...
随机推荐
- OSG 初始化为非全屏窗口
OSG默认的窗口时全屏的,调试的时候不方便. 在网上看到一段代码,可以非全屏显示 int _tmain(int argc, _TCHAR* argv[]){ osgViewer::Viewer vie ...
- input框颜色修该
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- python基础——使用dict和set
python基础——使用dict和set dict Python内置了字典:dict的支持,dict全称dictionary,在其它语言中也称为map(映射),使用键-值(key-value)存储,具 ...
- 使用show profiles分析SQL性能
如何查看执行SQL的耗时 使用show profiles分析sql性能. Show profiles是5.0.37之后添加的,要想使用此功能,要确保版本在5.0.37之后. 查看数据库版本 mysql ...
- CSS选择器以及优先级与匹配原理
最常用的五类CSS选择器 准确而简洁的运用CSS选择器会达到非常好的效果.我们不必通篇给每一个元素定义类(class)或ID,通过合适的组织,可以用最简单的方法实现同样的效果.在实际工作中,最常用的选 ...
- hdu 2050:折线分割平面（水题，递归）
折线分割平面 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...
- Spark编译安装和运行
一.环境说明 Mac OSX Java 1.7.0_71 Spark 二.编译安装 tar -zxvf spark-.tgz cd spark- ./sbt/sbt assembly ps:如果之前执 ...
- 对android中ActionBar中setDisplayHomeAsUpEnabled和setHomeButtonEnabled和setDisplayShowHomeEnabled方法的理解（转）
setHomeButtonEnabled这个小于4.0版本的默认值为true的.但是在4.0及其以上是false,该方法的作用:决定左上角的图标是否可以点击.没有向左的小图标. true 图标可以点击 ...
- 【poi】用POI新建一个xlsx文件【或者说将数据存入到xlsx中】/【将数据从xlsx中获取到项目中】
第一部分:写入xlsx中 使用POI创建一个xlsx文件: 项目结构如下: 具体使用的POI中的 XSSFWorkbook xlsx对象 Sheet 工作簿对象 Row 行对象 Cell 单元格 ...
- android去掉标题栏
在AndroidManifest.xml修改 把 <applicationandroid:allowBackup="true"android:icon="@draw ...