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浮层点击穿透问题

最新文章

热门文章