• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 安卓平台的浏览器 touchend 事件触发失效?

安卓平台的浏览器 touchend 事件触发失效?

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含touchend,touchstart等相关知识,匿名希望在学习及工作中可以帮助到您
点击应该触发 touchstart 和 touchend 两个事件,但是安卓手机中并没有触发 touchend,请问如何解决这个问题?

回复内容:

touch事件在手机浏览器上存在莫名的兼容性问题, 会导致touchend事件不触发!

http://code.google.com/p/android/issues/detail?id=19827
Working with touch events
On Android ICS if no preventDefault is called on touchstart or the first touchmove, further touchmove events and the touchend will not be fired.
As a workaround we need to decide in the first touchmove if this is a scroll (so we don’t call preventDefault) and then manually trigger touchend.

如果你没有太多顾虑(关于scroll的), 请在touchstart的handle中使用event.preventDefault(), 即可让touchend事件正常触发 感谢啊,莫名其妙的问题 最近几天开发也碰到了这个问题,项目要模拟一个app的向下拉动加载效果。我的解决办法是在touchmove中添加e.preventDefault(),将浏览器默认的滑动惯性去掉,这样就不会干扰到touchend事件的触发,然后再手写滑动效果,另外需要注意判定是否有滑动产生,避免干扰默认的点击效果触发:
var x, y, z;var slideCouter = 1; var hasMoved = false; var checking = false; var hasMore = true; $(document).on('touchstart', function (e) { z = $(document).scrollTop(); x = event.targetTouches[0].pageY; }).on('touchmove', function (e) { e.preventDefault(); hasMoved = true; y = event.targetTouches[0].pageY; z += x - y; $(document).scrollTop(z); }).on('touchend', function (e) { if (x - y > 200 && !checking && hasMoved && hasMore) { checking = true; slideCouter++; $('.login').removeClass('none'); $.ajax({ url: "createUrl('/teacher/categoryMore');?>", type: "get", data: { "keyword": '', "page": slideCouter }, cache: false, success: function (data) { completecall(data); } }); } hasMoved = false; }); ============== 目前别的方法都会有或多或少的弊端,该方法的弊端就是滑动惯性被取消,自己写的效果会不那么流畅,但还算比较好的解决这个兼容问题。 可以考虑同时监听touchcancel事件。 @jack king 使用touchcancel这个在android4.4中会出现复制文本之类的
复制文本是什么状况 我也想知道 我也遇到了这个问题啊,需要顾虑scroll,阻止默认事件这个行不通,使用touchcancel这个在android4.4中会出现复制文本之类的,这个要怎么解决? @bo bo 我要顾虑scroll,怎么解决这个问题啊?

您可能想查找下面的文章:

  • HTML5的触摸事件
  • 安卓平台的浏览器 touchend 事件触发失效?

相关文章

  • 2018-12-03HTML5 对各个标签的定义与规定:body的介绍_html5教程技巧
  • 2018-12-03html5规定在拖动被拖动数据时是否进行复制移动或链接的属性dropzone
  • 2018-12-03HTML5开源游戏引擎lufylegend1.6.0发布
  • 2018-12-03ProcessOn 一款HTML5在线作图工具怎么样?
  • 2017-08-06X/HTML5 和 XHTML2
  • 2018-12-03HTML5中如何使用rel属性的预加载功能?
  • 2018-12-03canvas需要在标签里直接定义宽高_html5教程技巧
  • 2018-12-03在微信上做 HTML5 网页和普通的网页开发有何不同?
  • 2018-12-03html5 shiv.js和respond.min.js详细介绍
  • 2017-08-06HTML5 Canvas实现烟花绽放特效

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5新特性之WebSocket
    • HTML5新增属性之拖拽属性(介绍)
    • canvas如何实现二维码和图片合成的代码
    • 苹果官网是怎么做到完美保证多平台浏览体验的?
    • HTML5 绘制图像(上)之:关于canvas元素引领下一代web页面的问题
    • 勤奋真的可以弥补天资的不足吗?
    • canvas如何来绘制一个椭圆形?canvas画椭圆的方法总结
    • HTML5学习笔记简明版(11):新增的API
    • HTML5中实现拖放效果无须借助javascript_html5教程技巧
    • 基于html5绘制圆形多角图案_html5教程技巧

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有