IONIC键盘弹出防止页面Header（title位置）自动上移位置（消失）

来源：互联网发布：上海银行淘宝金卡介绍编辑：程序博客网时间：2024/05/16 08:08

近两年由于html5技术的普及，混合类应用在移动市场占据了大量的份额，但是如果想用html5技术达到native的效果，还需要一点努力的。

比如在混合应用中，当页面空间不是很足的时候，点击输入框弹出键盘，header会自动向上移动，直到消失，此效果只发生在ios上，那我们应该如何解决呢？

我再项目中应用到了ionic，就以ionic为例，说一下我的解决方案。

安装插件

cordova plugin add ionic-plugin-keyboard.

这个插件是ionic在原有keyboard插件的基础上做了一些设置更改。

JS中的代码配置

 window.ionic.Platform.ready(() => {    if (window.cordova && window.cordova.plugins.Keyboard) {      window.cordova.plugins.Keyboard.hideKeyboardAccessoryBar(false);      if (window.ionic.Platform.isIOS()) {        window.cordova.plugins.Keyboard.disableScroll(true);      }    }  });

下面这段代码就是禁止header向上移动的。

window.cordova.plugins.Keyboard.disableScroll(true);

自己尝试一下吧！

0 0