在jQuery的事件绑定中，如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时，不会触发双击事件(dblclick)， 执行双击事件(dblclick)时却会触发两次单击事件(click)。

但有时候我们希望在执行双击事件的时候不去出发单击事件，那究竟该如何实现呢？

少bb 上代码 ：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <button>按钮</button>

    <script src="jquery.js"></script>

    <script>

        $(function () {

            // var time = null;

            //

            // $('div').click(function () {

            //     // 取消上次延时未执行的方法

            //     clearTimeout(time);

            //     //执行延时

            //     time = setTimeout(function(){

            //         //do function在此处写单击事件要执行的代码

            //     },300);

            // });

            //

            // $('div').dblclick(functin ({

            //     // 取消上次延时未执行的方法

            //     clearTimeout(time);

            //     //双击事件的执行代码

            // });

            // 单双击 的时间 间隔 是300ms

            // 如果解决 单双击冲突

            var timer = null;

            $('button').click(function(event) {

                clearTimeout(timer);

                // 定时器  300ms 一次性定时器

                timer = setTimeout(function(){

                    console.log('单机了');

                }, 300);

            });

            $('button').dblclick(function(event) {

                clearTimeout(timer);

                console.log('双机了');

            });

        })

    </script>

</body>

</html>

JQuery如何实现双击事件时不触发单击事件，解决鼠标单双击冲突问题的更多相关文章

  1. JQuery如何实现双击事件时不触发单击事件

    单击和双击事件的执行顺序: 单击(click):mousedown,mouseout,click: 双击(dblclick):mousedown,mouseout,click , mousedown, ...

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

    转自链接:https://www.shuzhiduo.com/A/xl560MKrzr/ 在jQuery的事件绑定中,如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单 ...

  3. jQuery解决鼠标单双击问题

    html代码如下: <button>点击</button> JQ代码如下: <script> $(function () { // 编写相关jQuery代码 // ...

  4. jQuery 双击事件（dblclick）时，不触发单击事件(click)

    我这是转载的文字 原文地址:http://www.cnblogs.com/wyblog/archive/2011/12/15/2289219.html 万恶的双击事件啊!! 在jQuery的事件绑定中 ...

  5. [转]jQuery 双击事件（dblclick）时，不触发单击事件(click)

    例1: 链接:http://www.w3school.com.cn/jquery/event_dblclick.asp HTML 系列教程 浏览器脚本 服务器脚本 ASP.NET 教程 XML 系列教 ...

  6. jquery双击事件会触发单击事件

    实际工作中,我们经常会遇到在同一个元素上,绑定多种事件类型,比较常见的是单击事件和一些鼠标事件,一般而言影响不大.但是如果同时绑定单击事件和双击事件呢? 其实,只要能够想明白的话,解决方案也比较简单, ...

  7. focus([[data],fn]) 当元素获得焦点时，触发 focus 事件。

    focus([[data],fn]) 概述 当元素获得焦点时,触发 focus 事件.直线电机选型 可以通过鼠标点击或者键盘上的TAB导航触发.这将触发所有绑定的focus函数,注意,某些对象不支持f ...

  8. dblclick([[data],fn]) 当双击元素时，会发生 dblclick 事件。

    dblclick([[data],fn]) 概述 当双击元素时,会发生 dblclick 事件.大理石量具哪家好 当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click.在很短的 ...

  9. JS事件 加载事件（onload）注意：1. 加载页面时，触发onload事件，事件写在<body>标签内。 2. 此节的加载页面，可理解为打开一个新页面时。

    加载事件(onload) 事件会在页面加载完成后,立即发生,同时执行被调用的程序. 注意:1. 加载页面时,触发onload事件,事件写在<body>标签内. 2. 此节的加载页面,可理解 ...

随机推荐

  1. 有用的Python代码片段

    我列出的这些有用的Python代码片段,为我节省了大量的时间,并且我希望他们也能为你节省一些时间.大多数的这些片段出自寻找解决方案,查找博客和StackOverflow解决类似问题的答案.下面所有的代 ...

  2. Swig 使用指南 （express模板）

    如何使用 API swig.init({ allowErrors: false, autoescape: true, cache: true, encoding: 'utf8', filters: { ...

  3. Amazon（iam）IAM用户启用MFA

    1.1 下载MFA软件 我这里选择Google的Authenticator 1.2 进入IAM 搜索IAM,点击进入 1.3 选择需要设置MFA的用户 1.4 选择安全证书 1.5 管理MFA设置 这 ...

  4. POJ2456 Aggressive cows(二分+贪心)

    如果C(d)为满足全部牛之间的距离都不小于d. 先对牛舍的位置排序,然后二分枚举d,寻找满足条件的d. #include<iostream> #include<cstdio> ...

  5. 面试题思考：web中关于一些容器基本概念的简单总结

    关键字:应用服务器.web服务器.web容器.jsp容器.servlet容器. 1.应用服务器: 作为应用程序服务器,要求可以通过各种协议(包括 HTTP 协议)把商业逻辑暴露给(expose)客户端 ...

  6. js修改剪切板内容的方法

    代码如下: //绑定在了body上,也可以绑定在其他可用元素行,但是不是所有元素都支持copy事件. $(document.body).bind({ copy: function(e) {//copy ...

  7. 教你在Ubuntu上体验Mac风格

    导读 老实说,我是个狂热的 Ubuntu 迷,我喜欢 Ubuntu 默认的 Unity 主题样式外观.此外,还有很多关于 Ubuntu 14.04 的漂亮图标主题样式 可用来美化默认的外观.但正如我上 ...

  8. Android 切换主题 (二)

    Android 切换主题 (二) 背景 我原来写过一篇文章关于 android 切换主题的文章 -- Android 切换主题以及换肤的实现 , 里面介绍了如何使用 setTheme() 来切换主题, ...

  9. Dubbo+Zookeeper视频教程

    http://www.roncoo.com/course/view/f614343765bc4aac8597c6d8b38f06fd#boxTwo

  10. Jsp 公用标签库

    <%@ page language="java" pageEncoding="UTF-8"%> <%@ taglib prefix=" ...