关于移动端点击无效的一些经验

  这两天在做一个WAP页面,在chrome上模拟移动端的时候,都好好的,然而放到手机上测试时,

发现有些点击事件直接无反应,但是有些有反应;

  本小白在想,难道是由于我页面上有用到滚动插件,里面的touch事件的preventDefault导致click失效?

于是,换成了touchSart事件试了下,效果比之前略好,但是,有重复点击事件,本小白排查了一会儿,

发现页面上明明在滚动区域有别的点击事件,为毛别的用的好好的,就这个不行,仔细对比,发现别的都是A标签,

无效的是DIV,于是,我就像发现了新大陆一样,麻溜的将DIV改成A标签,于是,妥妥的好了!

  于是,我又想,难道移动端DIV的点击事件都是这么鸡肋?,然后在一个非滚动区域的DIV上绑定事件试了下,

发现没问题,于是,我总结了下,在有用到滚动touch相关的事件里阻止了默认行为时,对DIV的点击绑定失效时,

将其转成A标签即可。

时间: 2025-01-02 17:09:15

关于移动端点击无效的一些经验的相关文章

解决百度地图js在移动端点击无效

添加触摸事件 //触摸事件(解决点击事件无效)--触摸开始,开启拖拽map.addEventListener('touchmove', function(e) {map.enableDragging();});//触摸结束始,禁止拖拽map.addEventListener("touchend", function(e) {map.disableDragging();}); 原文地址:https://www.cnblogs.com/yeyuqian/p/11969161.html

移动端点击、触碰

这篇文章将会阐述以下问题 延迟的click 拥抱tap 一次触碰 阻止它们!!!preventDefault还是stopPropagtion 模拟事件是什么鬼 事故现场 延迟 点穿(包含angular的ng-click) 焦点获取 分析Yocto,zepto,fastclick带来的思考 zepto -- 万恶的tap fastclick -- “完美” Yocto -- “后zepto时代替代者” 让我们开始吧! 迟到的click “移动端最好用tap,click是有延迟的...” 开始写移动

selector实现点击图片切换(解决常见的点击无效问题)

实现效果图:       图片未点击前                         图片点击后 selector的实现方法其实很简单,只需3步: 第一步:选择两张图片效果图放在res/drawable-hdpi中,放在mdpi也可以 第二步:在mdpi文件夹中新建xml文件,命名为selector.xml.注意名字selector后面会引用到. 在selector.xml文件中,完成代码: <?xml version="1.0" encoding="utf-8&qu

移动端点击300ms延迟

转载自:http://www.jianshu.com/p/6e2b68a93c88 一.移动端300ms点击延迟 一般情况下,如果没有经过特殊处理,移动端浏览器在派发点击事件的时候,通常会出现300ms左右的延迟.也就是说,当我们点击页面的时候移动端浏览器并不是立即作出反应,而是会等上一小会儿才会出现点击的效果.在移动WEB兴起的初期,用户对300ms的延迟感觉不明显.但是,随着用户对交互体验的要求越来越高,现今,移动端300ms的点击延迟逐渐变得明显而无法忍受. 那么,移动端300ms的点击延

后台找到repeater里面的div并添加客户端点击事件

public partial class Inv_SelectWorkservice : System.Web.UI.Page,IPostBackEventHandler{ } 通过OnItemCreated 找到repeater里面的div并添加客户端点击事件div要加上runat="server" id="itemTy" onclick="test" 后台: protected void Repeater2_ItemCreated(objec

Android - 监听Activity点击无效

监听Activity点击无效 本文地址: http://blog.csdn.net/caroline_wendy Activity须要先在Manifest注冊,才干在app中使用; Manifest: <activity android:name="me.chunyu.tvdoctor.healthvideo.VideoPlayingActivity" android:label="@string/app_name" /> 在内部库的G7Anno中: @

ios 添加到cell 上的button点击无效!扩大button的点击区域(黑魔法)

一般情况下点击效果都是正常的!要不然你对它做了什么?一般细心的小伙伴都没有遇到这种情况,但是呢! 当然我是二班的!在这里我主要讲两个问题,解决问题和普及魔法. 一.普及问题(button在cell上点击无效) 自定义一个cell,cell里边creat了一个button!然后调试了半天,什么反应都没有! 1.button的enable 设置为yes可点击的. 1.我以为我设置了交互禁用! self.userInteractionEnabled = YES; 2.button的frame越界了!

空a标签 a标签空的情况下 IE6 IE7下点击无效

最近做了好多网站专题页面,因为专题页面图片较多,个别banner上有1个到多个按钮,一种是用"图解img标签的usemap"的方法做链接,(图解img标签的usemap使用方法)[传送门] 另一种用则需要用空a标签来做,发现"a标签"在IE6与IE7中点击无效中点击不了("a标签"定义宽度和高度IE浏览器为零0),其他浏览器都正常(如果不正常请加"display:bolck;"(←推荐)或"float:left;&q

取消a标签在移动端点击时的背景颜色

一.取消a标签在移动端点击时的蓝色  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);  -webkit-user-select: none;  -moz-user-focus: none;  -moz-user-select: none; 二.使用图片作为a标签的点击按钮时,当触发touchstart的时候,往往会有一个灰色的背景 a,a:hover,a:active,a:visited,a:link,a:focus{     -webk