Android浮层点击穿透问题
最近做微信公众号开发的时候遇到一个问题,上线后发现此问题后检查代码没有发现问题,无奈只能回滚到上一个版本。
问题是这样的:页面一个选择的浮层,在浮层点击确定后,下面的页面会自动提交

在测试环境上无法重现,也不可能用正式环境测试问题,百撕不得骑姐之际,突然想到这个现象十分像JS冒泡,当然不是JS冒泡,那会不会是点了这个确定触发了下面的提交,测试环境没问题是因为测试环境由于数据原因,提交按钮刚好没在确定下面。
这个容易,造数据验证,果然猜对了。剩下的就好办了,在浮层还在的时候锁掉下面的提交就好了。
这个浮层是由mobiscroll.scroller控件产生的,去翻文档,发现特别慢,懒得翻墙就看了下控件的源码。
找到了浮层打开前的事件:onBeforeShow;又找到了选择事件,同时因为需要显示的值和控件原本的不同,就直接改代码了:
/**
* Set button handler.
*/
that.select = function () {
if (that.hide(false, 'set') !== false) {
setValue(true, true, 0, true);
var showText = that.getValue();
if(showText.length>12){
var text = showText.slice(0,11);
showText = text + "...";
}
/*event('onSelect', [that.val]);改为显示值*/
event('onSelect', [showText]);
/*加个事件*/
event('onEndSelect', [showText]);
}
}; /**
* Cancel and hide the scroller instance.
*/
that.cancel = function () {
if (that.hide(false, 'cancel') !== false) {
event('onCancel', [that.val]);
event('onEndSelect', [that.val]);
}
};
掉用处的代码:
var opt = {
'select-opt': {
preset: 'select',
group: true,
width: 50
,onBeforeShow:function(){
lockSure = true;
}
,onClose:function(){
setTimeout('lockSure = false;',400);
}
,onEndSelect:function(){
setTimeout('lockSure = false;',330);
}
}
};
上面onClose是同事连VPN后在文档中找到的事件,不过发现直接在事件中设置锁定变量值是不行的,只好延迟一下执行。经过测试,在手机反应比较慢时onClose在400毫秒时或选择结束时延迟330毫秒基本可以保证执行正常,选择结束效果产生会快一点,onClose的效果会比我加的事件处理全面一些,所以两个都保留了。
Android浮层点击穿透问题的更多相关文章
- Android Fragment 多层叠加时点击穿透解决方案
一.问题现象 多层fragment叠加时,点击上层fragment会使下层fragment的控件对应点击事件响应,这种现象就是点击穿透. 对于这种情况,我们一般都是对baseFragment进行vie ...
- 说说移动端web开发中的点击穿透问题
最近一直在忙于一个无线端的项目,由于之前主要工作都是在桌面端,移动端接触的比较少,所以中间遇到了很多的坑,做一个简单的记录. 问题背景 需求中有这样的一个功能,点击取件信息的时候会弹出一个地址列表的浮 ...
- UGUI 点击穿透问题
unity上 用 做游戏欢迎界面上通用的ui,然后导到游戏里面直接用,但发现游戏里面是用ngui的,点击ugui 的ui 会穿透过去 ngui会响应,原本模型的点击处理也会响应 我用的 unity 版 ...
- 点击穿透问题(http://www.tuicool.com/articles/6NfaUnM)
一.click与300ms延迟 移动浏览器提供一个特殊的功能:双击(double tap)放大 300ms的延迟就来自这里,用户碰触页面之后,需要等待一段时间来判断是不是双击(double tap)动 ...
- hitTest:withEvent:方法(此方法可实现点击穿透、点击下层视图功能)
此方法可实现点击穿透.点击下层视图功能 一. hitTest:withEvent:调用过程 iOS系统检测到手指触摸(Touch)操作时会将其放入当前活动Application的事件队列,UIAppl ...
- pointer-events属性屏蔽鼠标事件(点击穿透上层元素)
应用场景 我们在 HTML 开发时可能会遇到这样的情况:页面上有一些元素使用绝对定位布局,这些元素可能会遮盖住它们位置下方的某个元素的部分或者全部.默认情况下,下方元素被遮挡的部分是不会响应鼠标事件的 ...
- 微信小程序弹出层点击穿透问题
问题描述:使用小程序的modal组件实现遮罩层效果时,会出现滚动穿透的问题,即遮罩层后面的页面依旧可以滚动. 解决方案: 给底层页面动态添加 position:fixed; 代码: wxml: < ...
- IE8 没有内容的盒子,如果有定位,浮现在其他盒子上 可能会有点击穿透没有作用的情况
IE8 没有内容的盒子,如果有定位,浮现在其他盒子上 可能会有点击穿透没有作用的情况
- document.onclick在ios上不触发的解决方法与touchstart点击穿透处理
document.onclick = function (e) { var e = e ? e : window.event; var tar = e.srcElement || e.target; ...
随机推荐
- 关于ubuntu实机与虚机互相copy
我的开发环境是在ubuntu上的,但是ubuntu上没有官方支持的QQ,有些不太方便,所以在上面虚了一个Win7(先是win10,但是win10最新版本太坑了,不说了),不过经常会出现复制文件,或者文 ...
- 玩转spring boot——快速开始
开发环境: IED环境:Eclipse JDK版本:1.8 maven版本:3.3.9 一.创建一个spring boot的mcv web应用程序 打开Eclipse,新建Maven项目 选择quic ...
- JS核心系列:浅谈 call apply 与 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...
- div实现自适应高度的textarea,实现angular双向绑定
相信不少同学模拟过腾讯的QQ做一个聊天应用,至少我是其中一个. 过程中我遇到的一个问题就是QQ输入框,自适应高度,最高高度为3row. 如果你也像我一样打算使用textarea,那么很抱歉,你一开始就 ...
- WPF做12306验证码点击效果
一.效果 和12306是一样的,运行一张图上点击多个位置,横线以上和左边框还有有边框位置不允许点击,点击按钮输出坐标集合,也就是12306登陆的时候,需要向后台传递的参数. 二.实现思路 1.获取验证 ...
- Android总结之链式调用(方法链)
前言: 最近在学习总结Android属性动画的时候,发现Android的属性动画设计采用了链式调用的方式,然后又回顾了一下了以前接触的开源框架Glide也是采用链式调用的方式,还有最近火的一塌糊涂的R ...
- Mac上MySQL忘记root密码且没有权限的处理办法&workbench的一些tips (转)
忘记Root密码肿么办 Mac上安装MySQL就不多说了,去mysql的官网上下载最新的mysql包以及workbench,先安装哪个影响都不大.如果你是第一次安装,在mysql安装完成之后,会弹出来 ...
- 原生javascript 固定表头原理与源码
我在工作中需要固定表头这个功能,我不想去找,没意思.于是就写了一个,我写的是angularjs 自定义指令 起了个 "fix-header" ,有人叫 "freeze- ...
- 【干货分享】流程DEMO-出差申请单
流程名: 出差申请 业务描述: 员工出差前发起流程申请,流程发起时,会检查预算,如果预算不够,将不允许发起费用申请,如果预算够用,将发起流程,同时占用相应金额的预算,但撤销流程会释放相应金额的预算. ...
- Android—简单的仿QQ聊天界面
最近仿照QQ聊天做了一个类似界面,先看下界面组成(画面不太美凑合凑合呗,,,,):