微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

jquery mobile的触控点击事件会多次触发问题的解决方法_jquery

php中文网
发布： 2016-05-16 16:49:26
原创
2063人浏览过

jquery mobile 对手势触控提供了如下几个事件监听:

复制代码 代码如下:

tap  当用户点屏幕时触发
taphold 当用户点屏幕且保持触摸超过1秒时触发
swipe 当页面被垂直或者水平拖动时触发。这个事件有其相关联的属性，分别为scrollSupressionThreshold, durationThreshold, horizontalDistanceThreshold, and verticalDistanceThreshold
swipeleft 当页面被拖动到左边方向时触发
swiperight 当页面被拖动到右边方向时触发

但是 tap 事件在 windows8 触控设备和 android 设备上测试，均有一次点击多次触发的现象。
经测试，tap 方法的响应时间明显快于 onclick 事件，那么我们可以用 click 事件来处理 tap 事件的相应。示例代码参考如下：

但是 tap 事件在 windows8 触控设备和 android 设备上测试，均有一次点击多次触发的现象。
经测试，tap 方法的响应时间明显快于 onclick 事件，那么我们可以用 click 事件来处理 tap 事件的相应。示例代码参考如下：

DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

DeepSeek 10435
查看详情 DeepSeek
复制代码 代码如下:




 
 
 jquery mobile 的 tap 事件多次触发问题-志文工作室
 
 
 




 

  志文工作室
  

志文工作室


   菜单
 

　　

  

   

       

  

 


<script><BR> //轻点屏幕<BR> //$('div#article').on("tap",function(event){<BR> $('div#article').on("click",function(event){<BR> event.stopPropagation();<BR> console.log(111111);<BR> if(event.clientY < 80){<BR> //单击了页面上半部分,则向上滑动<BR> if(document.body.scrollTop<1) return;<BR> var scrollPosY = document.body.scrollTop - document.body.clientHeight + 100;<BR> $.mobile.silentScroll(scrollPosY);<BR> }else if(event.clientY > document.body.clientHeight - 80){<BR> var scrollPosY = document.body.scrollTop + document.body.clientHeight - 100;<BR> if(scrollPosY < document.body.scrollHeight){//顶部覆盖的高度+可见高度<网页体高度，则滚动一屏<BR> $.mobile.silentScroll(scrollPosY);<BR> }<BR> }<BR> });<BR> for(var i=1;i<200;i++){<BR> $('#article ol').append('<li>第 '+ i +' 行：志文工作室');<BR> }<BR></script>

另外一个替代方法参考：
JQueryMobile 在 Android 设备上的 tap 事件会出现多次触发的问题, 我们的解决方案是使用 Google FastButton，将原来需要用 tap 的地方改用 fastbutton 处理。

另外一个替代方法参考：
JQueryMobile 在 Android 设备上的 tap 事件会出现多次触发的问题, 我们的解决方案是使用 Google FastButton，将原来需要用 tap 的地方改用 fastbutton 处理。

相关标签：
jquery

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：jquery查找tr td 示例模拟_jquery 下一篇：js冒泡、捕获事件及阻止冒泡方法详细总结_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
Google Drive API：使用服务账户进行无用户认证访问指南 本教程旨在解决在Wix等无用户交互环境中，通过GoogleDriveAPI获取数据时，使用刷新令牌认证失败的问题。文章将详细介绍如何利用Google服务账户进行无缝、安全的服务器到服务器认证，涵盖服务账户的创建、权限配置以及在JavaScript环境中（如WixVelo后端）获取访问令牌并调用DriveAPI的完整实现方案。
2025-11-30 09:40:25
316
React应用中异步数据加载与渲染的健壮性实践：告别页面刷新崩溃 本教程针对React应用在页面刷新时因异步数据未加载完成导致崩溃的问题，深入探讨了条件渲染的必要性。我们将从常见的逻辑AND运算符方案入手，逐步引入更专业的解决方案，包括优化初始状态、管理加载和错误状态、利用可选链操作符以及构建健壮的条件渲染逻辑，旨在帮助开发者构建稳定、用户体验友好的React应用。
2025-11-30 09:32:13
177
React中onClick事件处理器的两种常见写法及其性能考量 在React中，处理onClick事件时，开发者常会遇到两种写法：直接引用函数和使用匿名函数包装。本文将深入探讨这两种方法的机制、各自的适用场景以及它们在性能上的细微差异。理解这些差异有助于编写更高效、更可维护的React组件。
2025-11-30 09:16:12
862
JavaScript：从点分隔字符串构建嵌套JSON结构 本教程将指导您如何使用JavaScript将一个点分隔的键字符串（如global.fontsize.bodyscale）和一个当前值，高效地转换为一个深度嵌套的JSON对象（如{global:{fontsize:{bodyscale:{value:currValue}}}}）。我们将重点介绍Array.prototype.reduceRight()方法的巧妙应用，通过从内到外构建对象结构，实现此功能，提供清晰的代码示例和详细解释。
2025-11-30 08:36:17
887
JavaScript函数式编程_Transducer Transducer是转换reduction过程的高阶函数，通过组合map、filter等操作为单一遍历流程，避免中间数组生成，提升性能。它返回接收reducer并返回增强reducer的函数，如map转换单元值，filter控制流入，再通过compose组合多个转换逻辑，最终在reduce中一次性执行，适用于数组、Observable等支持reduce的数据结构，实现高效、可复用、可组合的数据处理pipeline。
2025-11-30 08:04:02
741
如何正确在Angular父组件中更新子组件的Checkbox状态 本文深入探讨了在Angular应用中，当子组件的Checkbox状态需要根据父组件的异步操作（如API调用）结果进行更新时，可能遇到的常见问题及解决方案。我们将学习如何通过父子组件间的正确通信机制，结合Angular的变更检测，确保Checkbox状态在异步操作成功后得到准确且响应式的更新，避免直接@Input绑定失效的情况。
2025-11-30 08:01:17
942
JavaScript表单验证_复杂业务规则处理 表单验证需拆分逻辑以提升可维护性，将复杂规则封装为独立函数；2.可通过函数校验日期范围、动态必填项及金额总和限制；3.组合调用验证函数确保数据质量与用户体验。
2025-11-30 00:33:12
146
JavaScript日期处理_时区转换算法 JavaScript中Date对象存储UTC时间戳但显示本地时区，时区转换需理解其UTC本质。通过getTime()获取时间戳并手动加偏移可转时区，但推荐使用Intl.DateTimeFormat结合timeZone选项（如‘Asia/Shanghai’）进行准确格式化，避免构造函数解析错误。处理用户输入时应拼接时区标识或用国际化API，复杂场景建议采用moment-timezone或date-fns-tz等库以确保正确性。
2025-11-29 21:45:07
396
标签模板字面量_javascript模板引擎 标签模板字面量通过函数处理模板字符串，可实现如HTML转义等安全操作。
2025-11-29 21:44:02
983
JavaScript算法优化_递归与迭代 递归代码简洁但易栈溢出且效率低，迭代性能优但逻辑复杂；应根据问题选择并用记忆化或尾递归优化递归。
2025-11-29 21:44:02
389
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部