touchstart touchmove touchend click mouseup mousedown

最新推荐文章于 2024-10-05 10:44:18 发布
最新推荐文章于 2024-10-05 10:44:18 发布
阅读量328 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： js特性
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/wangjiali123123/article/details/82873010
本文解析了touchstart、touchmove、touchend等触控事件与click、mouseup、mousedown等鼠标事件的区别。touchstart通常比click事件响应更快，约提前200ms触发。文章还指出，touch系列事件主要用于移动端，而mouse系列事件则适用于桌面设备。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

对于这几个event的理解：

1touchstart比click要先执行，等到touchstart-》touchend执行完，才触发click 大概200ms左右，

2.touchstart和touchmove和touchend应用在移动端，mouseup，mousedown应用在windows。

HarmonyOS（二十四）——Harmonyos通用事件之触摸事件
hirezy
06-05 901
触摸事件就是当手指在组件上按下、滑动、抬起时触发的事件。
【高频考点精讲】手写拖拽功能：从mousedown到mouseup，完整实现元素拖拽效果
最新发布
全栈老李的博客
06-01 717
🧑‍🏫：全栈老李📅：2025 年 5 月🧑‍💻：前端初学者、进阶开发者🚀：本文由全栈老李原创，转载请注明出处。今天咱们来聊聊前端开发中一个既基础又实用的功能——元素拖拽。相信不少同学在开发后台管理系统、可视化搭建平台时都遇到过这个需求。全栈老李今天就带大家从零开始，手把手实现一个完整的拖拽功能。
touchend与click顺序
weixin_34235371的博客
10-02 198
http://www.w3cmm.com/javascript/touch.html     click 在 touchend之前   去除超链接的虚线框   http://www.cnblogs.com/kingwell/archive/2012/06/20/2555670.html   http://zhidao.baidu.com/link?url=vo8iRBTf1s9V...
移动端——页面点击（ touchend -> click）
diaocheng9093的博客
07-04 802
手机端页面好多要注意的，点击事件就是其中一个： 在手机端页面中使用 click，安卓手机能正常实现点击效果，可是苹果手机不能点击；用 touchend 代替 click，苹果手机中能点击，但是可能出现小问题。 所以，在进行移动端页面优化时，一般使用 touch 事件替代鼠标相关事件，用的较多的是使用 touchend 事件替代PC端的 click 和 mouseup 事件。 注：在...
ios 用touchend事件 pc用click touchend击穿
weixin_33725239的博客
01-05 336
var clickEvent = (function() { if ('ontouchend' in document.documentElement === true) return 'touchend'; else return 'click';})(); 击穿 用延迟300秒隐藏 $('.tip_page').fadeOut(300,function(){　　xxxxxxxxx ...
【移动端】事件基础
小秀的博客
10-05 1397
比如div1、diw2只有div2绑定了touchstart事件，第一次放下一个手指在dv2上，触发了touchstart事件，这个时候，三个集合的内容是一样的，都包含这个手指的touch,然后，再放下两个手指一个在div1上，一个在div2上，这个时候又会触发事件，但changedTouches里面只包含第二个第三个手指的信息，因为第一个没有发生变化，而targetTouches包含的是在第一个手指和第三个在 div2上的手指集合，touches包含屏幕上所有手指的信息，也就是三个手指。
jQuery基于$.ajax设置移动端click超时处理方法
01-19
click｛mousedown->mousemove->mouseup｝ click事件在移动设备上虽然会识别但却是最后一个执行的，所以如果不把click事件换成touchstart事件的话，就可能造成延时导致交互上也慢了几拍 所以在移动端最好把c
js中的touchstart,touchmove,touchchend
03-08
对于 `touchstart`、`touchmove` 和 `touchend` 这些触摸事件而言，它们分别对应鼠标事件中的 `mousedown`、`mousemove` 和 `mouseup`[^1]。 #### 触摸事件概述 - **TouchStart**: 当手指首次接触屏幕时触发此事件...
vue中利用原生js实现拖拽
Lpd_Reason的博客
01-10 767
思路：利用一个值判断鼠标的mousedown事件或者移动端的touchstart是否触发，利用另一个值表示鼠标的mousemove和touchmove事件是否触发，如果触发获取鼠标或者点击处相对于屏幕的偏移值，利用dom循环获取参照物相对于侧边屏幕的偏移值，然后两者相减取正，即为所拖拽的div相对于参照物的偏移值，再让1其在偏移处显示，如此即可实现拖拽。   <template>...
vue h5页面 解决touchstart，touchmove，touchend，click事件触发产生的问题
maoyuanh的博客
02-15 4588
我的思路是，触发touchstart方法的时候延迟200毫秒如果是就是触摸事件，否则在touchend里面判断就是点击十点，调用点击事件的方法即可。当你的需要即要求可以完成触摸事件，又要求有点击事件的时候，我们要搞清楚一个问题，事件触发的排序问题。
移动端touch事件执行顺序
weixin_43276017的博客
07-13 588
touchstart->touchmove（可无）->touchend->click 如果不想触发click事件可在touchend中阻止默认事件发生 event.preventDefault(); 如发现touch时没触发click事件，请检查是否阻止了默认事件
移动前端—touch事件与click事件的区别
qq_35043757的博客
11-28 2789
一·: 300毫秒的道德规范         移动设备访问的Web页面都是pc上的页面。在默认的viewpoint（980px）的页面往往都是需要“双击”或“捏开”放大来看清页面。正是为了确认确认用户是“单击”还是“双击”。Safari用300ms延迟来判断，而后来的iPhone，Android也用这种方式来判断，因此移动页面的click反应比PC端的慢上300毫秒。         为了解决
mousedown、mousemove、mouseup和touchstart、touchmove、touchend
weixin_34283445的博客
11-20 1054
拖动时候用到的三个事件：mousedown、mousemove、mouseup在移动端都不起任何作用。毕竟移动端是没有鼠标的，查资料后发现，在移动端与之相对应的分别是：touchstart、touchmove、touchend事件。还有一点要注意的是在PC端获取当前鼠标的坐标是：event.clientX和event.clientY，在移动端获取坐标位置则是：event.touches[0].cl...
【移动端H5】click事件和touch事件的区分
weixin_57208584的博客
08-17 1002
touch事件是移动端区别于pc端触控的独有事件，也是实现很多手势的基础事件。它具体包含了：touchstart（触摸开始时触发）、touchmove（触摸并产生移动时触发）、touchend（触摸结束时触发）等一系列事件。
touch事件 以及 点击穿透的三种解决方法(移动端)
weixin_46022934的博客
11-14 5605
移动端 touch事件以及touch事件点击穿透的解决方法 提示： touchstart—>touchmove—>touchend ----> click 上面的四种点击都可以在移动端进行使用!但是有明确的区别! 移动端:touchstart — touchmove — touchend ,三个事件是专门为移动端监测,触摸开始(按下),触摸移动,触摸结束(离开),三个事件. 文章目录移动端 touch事件以及touch事件点击穿透的解决方法前言一、touch事件1.touchstart-
HTML5触摸事件(touchstart、touchmove和touchend)
热门推荐
一生为追梦的博客
01-15 1万+
HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主要是触摸事件：touchstart、touchmove和touchend。 　　一开始触摸事件touchstart、touchmove和touchend是iOs版Safari浏览器为了向开发人员
iOS的HTML5不支持click，'touchend'通用
irizhao的专栏
09-06 2149
如：$api.addEvt(body, 'touchend', function(e) {
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值