当前位置: 首页 > news >正文

使用时间器区别网页上的单击和双击

使用时间器区别网页上的单击和双击

在网页上,单击事件包含一次 onmousedown,onmouseup,onclick的过程。同理,双击事件包含了onmousedown,onmouseup,onclick,onmousedown,onmouseup,onclick,ondblclick的过程。所以在网页上进行ondblclick触发时同时也会触发onclick,因此、当我们在同一个element同时注册了这2个事件时,我们需要将他们区别开来。以下使用延时处理来进行区别。

<script type="text/javascript">

  //当我们单击时,希望只执行clickAlert

  //当我们双击时,希望只执行dblclickAlert

  var timer;
  $(".test").on("click",function(){
    clearTimeout(timer);
    timer = setTimeout("clickAlert()",300); //单击的处理会延迟0.3秒触发
  }).on("dblclick",function(){
    clearTimeout(timer);
    dblclickAlert();
  });

  //单击要做的事情
  function clickAlert(){
    alert("此时为单击");
  }

  //双击要做的事情
  function dblclickAlert(){
    alert("此时为双击");
  }
</script>

posted @ 2018-08-30 14:44 scd 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/lichenx/p/9560110.html

相关文章:

  • css设置全局变量和局部变量
  • 宏观政策转向,消费金融行业能否送别“至暗时刻”?
  • vc code
  • FLIP-24+-+SQL+Client
  • 【转】【WPF】WPF - MVVM - 如何将ComboBox的Selectchange事件binding到ViewModel
  • linux内核中链表代码分析---list.h头文件分析(二)【转】
  • 时间不对导致vSAN服务无法启动
  • C# WinForm 技巧十: winfrom 全屏自适应屏幕分辨率
  • Java 软件高级工程师笔试题
  • Flask 的馈赠
  • redis的GEO实战
  • 苹果cms v10安装教程
  • Hadoop迁移MaxCompute神器之DataX-On-Hadoop使用指南
  • CentOS7源码包编译安装php7.2完整版
  • PXE安装与配置
  • 【跃迁之路】【735天】程序员高效学习方法论探索系列(实验阶段492-2019.2.25)...
  • 0x05 Python数据分析,Anaconda八斩刀
  • 230. Kth Smallest Element in a BST
  • bootstrap创建登录注册页面
  • Flannel解读
  • Java IO学习笔记一
  • java多线程
  • Next.js之基础概念(二)
  • PAT A1017 优先队列
  • PHP变量
  • PHP那些事儿
  • Python爬虫--- 1.3 BS4库的解析器
  • 浮现式设计
  • 区块链技术特点之去中心化特性
  • 使用parted解决大于2T的磁盘分区
  • 算法之不定期更新(一)(2018-04-12)
  • 通过几道题目学习二叉搜索树
  • 学习Vue.js的五个小例子
  • 原创:新手布局福音!微信小程序使用flex的一些基础样式属性(一)
  • 【干货分享】dos命令大全
  • Mac 上flink的安装与启动
  • 好程序员web前端教程分享CSS不同元素margin的计算 ...
  • 回归生活:清理微信公众号
  • 智能情侣枕Pillow Talk,倾听彼此的心跳
  • ​七周四次课(5月9日)iptables filter表案例、iptables nat表应用
  • !! 2.对十份论文和报告中的关于OpenCV和Android NDK开发的总结
  • #AngularJS#$sce.trustAsResourceUrl
  • #Linux(make工具和makefile文件以及makefile语法)
  • #我与Java虚拟机的故事#连载13:有这本书就够了
  • (1) caustics\
  • (1)安装hadoop之虚拟机准备(配置IP与主机名)
  • (C#)Windows Shell 外壳编程系列4 - 上下文菜单(iContextMenu)(二)嵌入菜单和执行命令...
  • (C语言)二分查找 超详细
  • (pytorch进阶之路)CLIP模型 实现图像多模态检索任务
  • (安卓)跳转应用市场APP详情页的方式
  • (差分)胡桃爱原石
  • (二)WCF的Binding模型
  • (十六)串口UART
  • (一)Linux+Windows下安装ffmpeg
  • (原)本想说脏话,奈何已放下