我爱编程ionic3开发

Ionic 3 ion-textarea如何自动聚焦并弹出键盘

2018-04-16  本文已影响0人  风语菡

步骤如下:
1、html 直接引入ion-textarea,不需要什么特殊处理
2、js中 通过ElementRef 获取textarea元素

import { Keyboard } from '@ionic-native/keyboard';
import { ElementRef } from '@angular/core';

//键盘弹起,tabbar隐藏
keyboardUp() {
    this.displayTab(false);
    this.showFooter = true;
    let el = this.elRef.nativeElement.querySelector('textarea');
    setTimeout(() => {
    el.focus();
    this.keyboard.show();   //for android
    }, 500);     //至少 150 ms
}

说明:

 1.  keyboard 需要依赖注入,为了在android中掉起键盘
 2.  延时是必须的,网上说至少150ms,我的项目中得设500ms,在iOS上才没有异常;

3、在config.xml中配置 使在iOS能正常掉起键盘
<preference name="KeyboardDisplayRequiresUserAction" value="false" />

通过以上三步,就能使ion-textarea 自动聚焦和弹起键盘了

参考:https://stackoverflow.com/questions/39612653/set-focus-on-an-input-with-ionic-2/42555014

上一篇下一篇

猜你喜欢

热点阅读