web app开发键盘挡住了文本框问题解决

  me.methods = {
            setScrollTop: function () {
                var ele = lib.$(me.el).find(".page-content"); //lib.$('div[data-page="oa!app/page/HR/Performance/OkrReport"] div[class="page-content drp-style-hh per-page"]');//.scrollTop(100)
                if (!app.f7.device.ios) {
                    var screenHeigth = lib.$(window).height();// window.screen.availHeight;
                    var winHeight = lib.$(window).height();
                    var scollTop = lib.$(me.el).find(".page-content").scrollTop(); //lib.$('div[data-page="oa!app/page/HR/Performance/OkrReport"] div[class="page-content drp-style-hh per-page"]').scrollTop();
                    var offsetHeight = 0;
                    var bKeyboard = false;
                    var interval;
                    ele.find("input,textarea").click(function (data, event) {
                        if (interval) {
                            window.clearInterval(interval);
                        }
                        ele.css("padding", "44px 0 300px 0");
                        scollTop = lib.$(me.el).find(".page-content").scrollTop();
                        var clientHeigth = window.screen.availHeight//lib.$(window).height();
                        var top = lib.$(data.currentTarget).offset().top;
                        var clientHalf = clientHeigth / 2;
                        var clientHalf2 = clientHeigth / 4;
                        offsetHeight = top - clientHalf2 + scollTop;
                        if (clientHalf < top) {
                            bKeyboard = true;
                            lib.$(me.el).find(".page-content").scrollTop(offsetHeight);
                        }
                        interval = setInterval(function () {
                            if (lib.$(window).height() < screenHeigth) {
                                ele.css("padding", "0px 0 300px 0");
                                if (bKeyboard) {
                                    lib.$(me.el).find(".page-content").scrollTop(offsetHeight);
                                }
                            } else {
                                bKeyboard = false;
                                ele.css("padding", "0");
                            }
                        }, 200);
                    });
                } else {
                    ele.css("padding", "0");
                }

            },

然后在me.after里面调用这个方法

 

或者如下:

TxtClick: function (data, event) {
                    var pannel = event.currentTarget;
                    setTimeout(function () {
                        pannel.scrollIntoView();
                        pannel.scrollIntoViewIfNeeded();
                    }, 100);
                }

  <textarea name="advFormTextarea" placeholder="部门销售额达到150000元" class="okr-obj-textarea" data-bind="value:sKeyResult,click:$root.event.TxtClick,attr:{'readonly':krRdl}"></textarea>
但是都只适用于整个界面是一起滚动的,如果顶部固定了一部分内容那么就无效

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页