最简单的办法,就只绑定一个事件不就行了;

第二种,我觉得和第一种也没啥区别。。

const Button = document.getElementById("targetButton");

const clickEvent = (function() {
if ('ontouchstart' in document.documentElement === true)
return 'touchstart';
else
return 'click';
})(); Button.addEventListener(clickEvent, e => {
console.log("things happened!");
})

解决移动端touch事件与click冲突的问题的更多相关文章

  1. 移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法

    这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且to ...

  2. 移动端touch事件影响click事件的相关解决方法

    preventDefault()的方法,阻止事件的默认行为. 在移动端,手指点击一个元素,会经过:touchstart --> touchmove -> touchend -->cl ...

  3. 解决移动端touch事件(touchstart/touchend) 的穿透问题

    情景: 我们在移动端点击事件click对比touchend会有很明显的300ms的延迟,为啥? 浏览器在 click 后会等待约300ms去判断用户是否有双击行为(手机需要知道你是不是想双击放大网页内 ...

  4. 移动端开发用touch事件还是click事件

    前端开发现在包含了跨浏览器,跨平台(不同操作系统)和跨设备(不同尺寸的设备)开发. 在移动开发的过程中,到底选取touch事件还是click事件?对了,请不要鄙视click,click在移动端开发用着 ...

  5. H5案例分享:移动端touch事件判断滑屏手势的方向

    移动端touch事件判断滑屏手势的方向 方法一 当开始一个touchstart事件的时候,获取此刻手指的横坐标startX和纵坐标startY: 当触发touchmove事件时,在获取此时手指的横坐标 ...

  6. 移动端touch事件 || 上拉加载更多

    前言: 说多了都是泪,在进行项目开发时,在上拉加载更多实现分页效果的问题上,由于当时开发任务紧急,所以就百度找了各种移动端的上拉下拉 实现加载更多的插件.然后就留下了个坑:上拉加载的时候会由于用户错误 ...

  7. 原生js移动端touch事件实现上拉加载更多

    大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...

  8. 移动端 touch 事件的originalEvent

    对于移动端的触摸事件,我们通过touchstart.touchmove.touchend实现,PC端一般使用mousedown.mousemove.mouseup实现. 我们获取事件坐标,原生js获取 ...

  9. 移动端Touch事件基础

    1.三个常用的移动端事件 ontouchstart 手指按下时触发 ontouchmove 手指移动时触发 ontouchend 手动抬起时触发 注意:这些事件当作事件属性使用时,不兼容谷歌浏览器. ...

随机推荐

  1. jquery 全选,反选

    <?php foreach ($contents as $item) { ?> <tr> <td><input name="qx" val ...

  2. QQ第三方授权登录OAuth2.0实现(Java)

    准备材料 1.已经备案好的域名 2.服务器(域名和服务器为统一主体或域名已接入服务器) 3.QQ号 4.开发流程:https://wiki.connect.qq.com/%E5%87%86%E5%A4 ...

  3. 那些初学python犯过的小白错误(学习笔记1)

    一.关于print函数 区别于c和py2,py3的print的正确形式如下:print("hello world") 错误语句:print"hello world&quo ...

  4. ADB命令无法导出文件到物理机上处理办法

    因为想查看一下脚本生成的sqlite文件.就想导出文件,,结果导出adb pull命令一直报错.使用su也是错误的..最后发现adb pull 不能再adb的命令状态下执行.需要退出adb命令.然后直 ...

  5. java中的Overload和Override

    Overload为重载,它是指我们可以定义一些名称相同的方法,通过定义不同的输入参数来区分这些方法 然后再调用时,就会根据不同的参数样式,来选择合适的方法执行 在使用重载时只能通过不同的参数样式. 例 ...

  6. 11g bug event 'cursor: mutex S'-引发的CPU冲高问题

    问题背景:客户反应数据库服务器CPU占用过高 1> 确认问题根源登录客户DB服务器: top 查看当前负载 (几乎100%)top - 10:47:55 up 29 days, 21:51, 3 ...

  7. Jmeter Json List Element Assertion使用详解

    使用背景: jmeter4.0本身提供json Assertion断言,但当我们想要对返回的json list中的多个字段进行断言的时候,我们就会感到很无力.那么此时我们就可以通过Json List ...

  8. Web页面解析过程(浅)

    web页面流程 域名解析DNS 域名解析:把域名指向网络空间IP,让人们通过简单的域名访问Web网站的服务. DNS:域名系统 DNS服务器:记录着域名及其对应的IP地址 解析域名: ​ 浏览器中输入 ...

  9. js中的toString和valueOf

    数据的转换 基本上,所有JS数据类型都拥有valueOf和toString这两个方法,null除外.它们俩解决javascript值运算与显示的问题 所有对象继承了两个转换方法: 第一个是toStri ...

  10. [转] Java 无界阻塞队列 DelayQueue 入门实战

    原文出处:http://cmsblogs.com/ 『chenssy』 DelayQueue是一个支持延时获取元素的无界阻塞队列.里面的元素全部都是"可延期"的元素,列头的元素是最 ...