单双击的冲突处理

再点击事件中,如果在一个按钮上同时绑定单击事件以及双击事件,那么双击事件将没有办法执行。

下面的方法就是为了解决这个问题:

HTML:

就是整个按钮O(∩_∩)O~

<input type="button" class="click" value="点击事件" />

JS:

var TimeFn = null;
$(function () {
    //定义setTimeout执行方法
    $(‘.click‘).click(function () {
        // 取消上次延时未执行的方法
        clearTimeout(TimeFn);
        //执行延时
        TimeFn = setTimeout(function () {
            alert("单击")
        }, 300);
    });

    $(‘.click‘).dblclick(function () {
        // 取消上次延时未执行的方法
        clearTimeout(TimeFn);
        alert("双击")
    })
})

将单击事件延时处理一下,说不定是双击呢O(∩_∩)O~

时间: 2024-10-08 16:54:50

单双击的冲突处理的相关文章

JQuery如何实现双击事件时不触发单击事件,解决鼠标单双击冲突问题

在jQuery的事件绑定中,如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时,不会触发双击事件(dblclick), 执行双击事件(dblclick)时却会触发两次单击事件(click). 但有时候我们希望在执行双击事件的时候不去出发单击事件,那究竟该如何实现呢? 少bb 上代码 : <!DOCTYPE html> <html lang="en"> <head> <meta charset

JQuery解决鼠标单双击冲突问题

转自链接:https://www.shuzhiduo.com/A/xl560MKrzr/ 在jQuery的事件绑定中,如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时,不会触发双击事件(dblclick), 执行双击事件(dblclick)时却会触发两次单击事件(click). html代码: <button>点击</button> JQ代码: <script> $(function () { // 编写相关jQu

给同一个按钮添加单双击事件

1.单双击事件的添加. 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>单双击事件</title> 6 </head> 7 <body> 8 <input type="button" onclick="return fun(1

jquery 单击和双击事件冲突解决方案

本人需要给bootstrap-treeview的树节点添加双击事件.而该插件原生方法中不带双击事件功能.该插件的节点默认绑定的单击事件,由此引起了单击事件和双击事件的冲突. 编写测试代码 引起冲突的代码: 问题效果展示: 每一次触发双击事件都会引起两次单击事件 解决冲突的代码: 解决问题效果展示: 完美解决单击事件和双击事件冲突问题 这里主要用到两个HTML DOM Window对象中函数,settimeout(),clearTimeout() 我这里两个单击事件触发的时间间隔设置在等于300毫

JS同时绑定单双击事件

这两天工作上遇到这种情况,需要在tree组件上的每个节点绑定单双击事件,怎么实现呢?借助js的定时器来实现这个功能吧,思路是这样的:给定时器设置一个时间,如果在该时间段内用户点击一次则触发单机事件,大于1的话就执行双击事件.废话不多说,这里我们用一个示例来说明: 首先要引入jQuery,这里用jquery来为测试元素绑定事件 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <

解决问题:Bootstrap Form表单和回车冲突的问题

[问题]有时候我们想在bootstrap的Form表单中添加自己的回车事件,但是我按回车总是莫名其妙刷新我的页面. 本来表单和地址栏长这样: 键入2,回车,页面被刷新,地址栏就成这样了: [原因]bootstrap中,你用一个input输入框,就会绑定你的回车事件(我还没搞清楚源代码在哪..): 多个input输入框,就不会出现这种状况. [解决办法1]添加一个隐藏表单: <form class="navbar-form navbar-left" role="searc

js区分鼠标单双击 阻止事件冒泡

function clickOrDblClick(obj) { count++; if (obj != undefined) { var rowStr = $.trim($(obj).find("td:eq(1)").text().replace(/※/g, '')); currentRowpm = rowStr; } timer = window.setTimeout(function(obj) { var currentTr = $("#tbMainDeputy"

iOS UIButton单双击处理响应不同的方法

//显示目标 双击显示当前用户坐标位置 UIButton * btnShowDistination = [[UIButton alloc]initWithFrame:CGRectMake(15, SCREEN_HEIGHT-110-64, 35, 35)]; [btnShowDistination setBackgroundImage:[UIImage imageNamed:@"show_distination"] forState:UIControlStateNormal]; [bt

关于iOS延时操作,阶段性总结(部分关于点击,双击事件冲突)

之前写过一个简单的图片查看器,在图片单击,双击事件处理上遇到问题,通过延时单击事件操作. 方法一: 详细:1.设置全局变量 bool doubleTap; 在单击事件方法中设置延时操作 单击时进行延时: dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ if (doubleTap == YES) return; //单击事件的相