touchstart 事件与 click 事件的冲突
const clickEvent = (
function
() {
if
(
'ontouchstart'
in
document.documentElement ===
true
)
return
'touchstart'
;
else
return
'click'
;
})();
Button.addEventListener(clickEvent, e => {
console.log(
"things happened!"
)
})
touchstart 事件与 click 事件的冲突的更多相关文章
- 如何解决 touchstart 事件与 click 事件的冲突
一 · 业务场景的描述 在对已完成的PC站点进行移动端适配时,我们想要站点在移动设备上有更快的响应速度,以带给用户更好的体验,此时,我们应该使用移动设备专用的事件系统,例如,使用 touchstart ...
- 移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法
这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且to ...
- 移动端开发用touch事件还是click事件
前端开发现在包含了跨浏览器,跨平台(不同操作系统)和跨设备(不同尺寸的设备)开发. 在移动开发的过程中,到底选取touch事件还是click事件?对了,请不要鄙视click,click在移动端开发用着 ...
- tap,touch,touchstart,事件与click事件的区别
根据源码所见, 移动端为了将将单击事件更加灵敏,所以现在的JQM,ST...框架都将JS单击事件封装成tap,或者touch或者touchstart事件, 其实现本质是将click触发多次,以打成移动 ...
- 移动端touch拖动事件和click事件冲突问题解决
通过一个悬浮球交互功能的案例来阐述问题,以及解决办法. 实现效果 类似微信里的悬浮窗效果,苹果手机的悬浮球功能效果 可以点击拖动,然后吸附在窗口边缘 点击悬浮球,可以跳转界面,或者更改悬浮球的形态 准 ...
- onblur事件和click事件冲突
在js中onblur事件的优先级click事件,所以同一个元素上绑定两个事件的时候,onblur事件会冲掉click事件. 解决方案:将click事件改成mousedown事件
- 移动端touch事件影响click事件的相关解决方法
preventDefault()的方法,阻止事件的默认行为. 在移动端,手指点击一个元素,会经过:touchstart --> touchmove -> touchend -->cl ...
- jquery点击click事件和blur事件冲突如何解决
最近做了一个查询小功能,input输入框输入文字后,自动列出几条查询结果,可以键盘上下键或鼠标进行查询结果选择,并且点击输入框其他地方要隐藏这个列出的结果. 但比较头疼的是input上添加blur事件 ...
- 移动端click事件延迟300ms的原因以及解决办法
这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...
随机推荐
- Android 开发学习进程0.19 webview 的使用
Android 中的webview android 中的webview是可以在app内部打开HTML等的网页,不必再打开浏览器,有两种实现方法,即webviewclient webChromeclie ...
- 45道Promise面试题
来看看通过阅读本篇文章要点: Promise的几道基础题 Promise结合setTimeout Promise中的then.catch.finally Promise中的all和race async ...
- Gulp的安装及用法
1.安装淘宝镜像 npm install cnpm -g --registry=https://registry.npm.taobao.org cnpm -v 2.生成项目描述文件 package.j ...
- try easy pytest 1tep介绍
『 tep is a testing tool to help you write pytest more easily. Try Easy Pytest! 』 tep前身 tep的前身是接口自动化测 ...
- Robot Framework(5)——自动化示例
上篇介绍了一些selenium2在robot framework中的一些关键字,这一篇主要来记录一下实际应用 一.安装并导入Selenium2Library 安装的工作一开始已经完成,可以用pip l ...
- 强化学习模型实现RL-Adventure
源代码:https://github.com/higgsfield/RL-Adventure 在Pytorch1.4.0上解决bug后的复现版本:https://github.com/lucifer2 ...
- 在服务器上使用python-gym出现的显示问题
参考链接: http://www.luyixian.cn/news_show_392045.aspx https://www.cnblogs.com/cenariusxz/p/12666938.htm ...
- IDEA报错:Class JavaLaunchHelper is implemented in both
在IDEA运行一个程序时报错: Class JavaLaunchHelper is implemented in both 这个错误是Mac下Java 的一个bug,意思是这个JavaLaunchHe ...
- CSS 选择器及优先级
CSS 选择器及优先级 1.根据权值计算 div .class1 #people的权值等于1+10+100=111 .class2 li #age的权值等于10+1+100=111 2.权值相同,那么 ...
- linux网络配置及虚拟机连接不上网排错思路
第1章 操作系统与虚拟软件的使用 1.1 虚拟软件使用方法 Vmware 1.1.1 开启vmware 注: 同时只能开启一个VMware软件,如果开了两个VMware窗口 提示 ...