点击键盘上的离子聚焦输入 - 键盘重叠并且不会聚焦输入

Question

当我用ion-item或输入标记点击离子应用程序中的输入时，键盘重叠并且不聚焦。

默认情况下关注所有输入的最简单方法是什么？或者只是让它专注于点击。

<ion-item> 
    <ion-input type="email" placeholder="Email" name="email" required></ion-input> 
</ion-item> 

<input class="round-input" type="text" placeholder="Email" name="email2" required /> 

以下适用于离子输入的ios但不适用于android。

.input-cover { 
    position: static; 
} 

Answer 1

我已经实现了这种合理工作的方式。

this.keyboard.onKeyboardShow().subscribe(e => { 

console.log('Keyboard height is: ' + e.keyboardHeight); 

jQuery('body').animate({ 'marginTop': - e.keyboardHeight + 'px' }, 200); 

}); 

this.keyboard.onKeyboardHide().subscribe(e => { 

jQuery('body').animate({ 'marginTop': 0 + 'px' }, 200); 

}); 

Answer 2

//add this on a controller on which you want to focus a filed 
 
var input = this; 
 
    input.focus = function() { 
 
     document.getElementById('input').focus(); 
 
    };

<form name="loginform" novalidate> 
 
    <div class="login-form "> 
 
     <div class="row"> 
 
      <div class="col" ng-init="input.focus();"> 
 
       <span class="icon-login"> <i class="icon ion-person placeholder-icon"></i></span> 
 
        <input type="email" id="email_address" placeholder="Email Address" name="email_address" ng-model="data.email_address" focus-me autofocus/> 
 
      </div> 
 
     </div> 
 
     <div class="row"> 
 
      <div class="col"> 
 
       <span class="icon-login"><i class="icon ion-locked placeholder-icon"></i></span> 
 
        <input type="password" placeholder="Password" name="password" ng-model="data.password"/> 
 
      </div> 
 
     </div> 
 
     <button type="submit" ng-click="login()" class="button button-light text-uppercase Avenir-Medium text-blue margintp10"> 
 
      Login 
 
     </button> 
 
    </div> 
 
</form>