iOS键盘弹出后PopPicker出现的临时解决方法

mui

原因:和iOS中其他有input的地方出现错乱的情况一样,poppicker的样式使用了fixed:
.mui-poppicker {
position: fixed;
}
在mui.poppicker.css中。

所以,分别在poppicker的显示和隐藏代码中对poppicker的display做处理。这里的显示和隐藏其实是修改poppicker的样式bottom,分别是0px和-300px,配合了动画的css,并没有改变display,所以,键盘弹出时poppicker露了出来。

解决方法:
mui.poppicker.js中增加初始化、show和hide方法中display的改变。

           ```javascript
           //init构造函数最后增加两行:                
           self.panel.style.display = 'none';
       self.body.style.display = 'none';

           //显示
    show: function(callback) {
        var self = this;
                    //增加以下2行
        self.panel.style.display = 'block';
        self.body.style.display = 'block';

        self.callback = callback;
        self.mask.show();
        document.body.classList.add($.className('poppicker-active-for-page'));
        self.panel.classList.add($.className('active'));
        //处理物理返回键
        self.__back = $.back;
        $.back = function() {
            self.hide();
        };
    },
    //隐藏
    hide: function() {
        var self = this;
        if (self.disposed) return;
        self.panel.classList.remove($.className('active'));
        self.mask.close();
        document.body.classList.remove($.className('poppicker-active-for-page'));

                    //增加以下2行
        self.panel.style.display = 'none';
        self.body.style.display = 'none';

        //处理物理返回键
        $.back=self.__back;
    }
0 分享

要回复文章请先登录注册