最近做微信公众号开发的时候遇到一个问题,上线后发现此问题后检查代码没有发现问题,无奈只能回滚到上一个版本。

  问题是这样的:页面一个选择的浮层,在浮层点击确定后,下面的页面会自动提交

  

  在测试环境上无法重现,也不可能用正式环境测试问题,百撕不得骑姐之际,突然想到这个现象十分像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浮层点击穿透问题的更多相关文章

  1. Android Fragment 多层叠加时点击穿透解决方案

    一.问题现象 多层fragment叠加时,点击上层fragment会使下层fragment的控件对应点击事件响应,这种现象就是点击穿透. 对于这种情况,我们一般都是对baseFragment进行vie ...

  2. 说说移动端web开发中的点击穿透问题

    最近一直在忙于一个无线端的项目,由于之前主要工作都是在桌面端,移动端接触的比较少,所以中间遇到了很多的坑,做一个简单的记录. 问题背景 需求中有这样的一个功能,点击取件信息的时候会弹出一个地址列表的浮 ...

  3. UGUI 点击穿透问题

    unity上 用 做游戏欢迎界面上通用的ui,然后导到游戏里面直接用,但发现游戏里面是用ngui的,点击ugui 的ui 会穿透过去 ngui会响应,原本模型的点击处理也会响应 我用的 unity 版 ...

  4. 点击穿透问题(http://www.tuicool.com/articles/6NfaUnM)

    一.click与300ms延迟 移动浏览器提供一个特殊的功能:双击(double tap)放大 300ms的延迟就来自这里,用户碰触页面之后,需要等待一段时间来判断是不是双击(double tap)动 ...

  5. hitTest:withEvent:方法(此方法可实现点击穿透、点击下层视图功能)

    此方法可实现点击穿透.点击下层视图功能 一. hitTest:withEvent:调用过程 iOS系统检测到手指触摸(Touch)操作时会将其放入当前活动Application的事件队列,UIAppl ...

  6. pointer-events属性屏蔽鼠标事件(点击穿透上层元素)

    应用场景 我们在 HTML 开发时可能会遇到这样的情况:页面上有一些元素使用绝对定位布局,这些元素可能会遮盖住它们位置下方的某个元素的部分或者全部.默认情况下,下方元素被遮挡的部分是不会响应鼠标事件的 ...

  7. 微信小程序弹出层点击穿透问题

    问题描述:使用小程序的modal组件实现遮罩层效果时,会出现滚动穿透的问题,即遮罩层后面的页面依旧可以滚动. 解决方案: 给底层页面动态添加 position:fixed; 代码: wxml: < ...

  8. IE8 没有内容的盒子,如果有定位,浮现在其他盒子上 可能会有点击穿透没有作用的情况

    IE8 没有内容的盒子,如果有定位,浮现在其他盒子上 可能会有点击穿透没有作用的情况

  9. document.onclick在ios上不触发的解决方法与touchstart点击穿透处理

    document.onclick = function (e) { var e = e ? e : window.event; var tar = e.srcElement || e.target; ...

随机推荐

  1. 算法笔记_013:汉诺塔问题(Java递归法和非递归法)

    目录 1 问题描述 2 解决方案  2.1 递归法 2.2 非递归法 1 问题描述 Simulate the movement of the Towers of Hanoi Puzzle; Bonus ...

  2. mysql 学习总结

    MYSQL的增.删.查.改   注册.授权 #创建一个对数据库中的表有一些操作权限的用户,其中OPERATION可以用all privileges替换,DBNAME.TABLENAME可以用*替换,表 ...

  3. DDD 领域驱动设计-商品建模之路

    最近在做电商业务中,有关商品业务改版的一些东西,后端的架构设计采用现在很流行的微服务,有关微服务的简单概念: 微服务是一种架构风格,一个大型复杂软件应用由一个或多个微服务组成.系统中的各个微服务可被独 ...

  4. AFNetworking 3.0 源码解读 总结(干货)(上)

    养成记笔记的习惯,对于一个软件工程师来说,我觉得很重要.记得在知乎上看到过一个问题,说是人类最大的缺点是什么?我个人觉得记忆算是一个缺点.它就像时间一样,会自己消散. 前言 终于写完了 AFNetwo ...

  5. 【绝对干货】仿微信QQ设置图形头像裁剪,让你的App从此炫起来~

    最近在做毕业设计,想有一个功能和QQ一样可以裁剪头像并设置圆形头像,额,这是设计狮的一种潮流. 而纵观现在主流的APP,只要有用户系统这个功能,这个需求一般都是在(bu)劫(de)难(bu)逃(xue ...

  6. ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存

    ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存 part 1:给我点时间,允许我感慨一下2016年 正好有时间,总结一下最近使用的一些技术,也算是为2016年画上一个完 ...

  7. 漫谈C#编程语言在游戏领域的应用

    0x00 前言 随着微软越来越开放,C#也变得越来越吸引人们的眼球.而在游戏行业中,C#也开始慢慢地获得了关注.这不, 网易绝代双娇手游团队已经全面使用.Net Core支持前后端统一C#开发,跨平台 ...

  8. [原] KVM 虚拟化原理探究(3)— CPU 虚拟化

    KVM 虚拟化原理探究(3)- CPU 虚拟化 标签(空格分隔): KVM [TOC] CPU 虚拟化简介 上一篇文章笼统的介绍了一个虚拟机的诞生过程,从demo中也可以看到,运行一个虚拟机再也不需要 ...

  9. javascript动画系列第四篇——拖拽改变元素大小

    × 目录 [1]原理简介 [2]范围圈定 [3]大小改变[4]代码优化 前面的话 拖拽可以让元素移动,也可以改变元素大小.本文将详细介绍拖拽改变元素大小的效果实现 原理简介 拖拽让元素移动,是改变定位 ...

  10. .Net语言 APP开发平台——Smobiler学习日志:如何快速在手机上实现ContextMenu

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 样式一 一.目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的&qu ...