Ionic Framework iOS Eingabefokus Probleme

Ich habe derzeit Probleme mit dem Fokus auf meine Eingaben für iOS. Es funktioniert perfekt auf Android, aber aus irgendeinem Grund geht etwas mit iOS, wo es manchmal mehrere Klicks dauert, bevor es tatsächlich ein Klickereignis auf die Eingabe registriert und die Tastatur mit Fokus in der Eingabe öffnet und zu anderen Zeiten den Fokus auf einige zufällige Elemente legt hinter dem sichtbaren, also öffnet sich die Tastatur, aber das Eingabefeld hat keinen Fokus. Wir haben mehrere Eingänge, die hinter dem sichtbaren versteckt sind, aber das sollte nicht wichtig sein.Ionic Framework iOS Eingabefokus Probleme

Ionic Info:
Ihre Systeminformationen:
Cordova CLI: 6.2.0
Ionic Framework Version: 1.3.1
Ionic CLI Version: 2.1.1
Ionic App Lib Version: 2.1.1
ios-deploy Version: 1.8.6
ios-sIM-Version: 5.0.8
Betriebssystem: Mac OS X Sierra
Knoten Version: V6.3.0
Xcode Version: Xcode 8.0 Build-Versio n 8A218a

Ein Grundzüge unseres Codes finden Sie hier: http://codepen.io/anon/pen/wzYEQk

<ion-view title="COMPANY" hide-back-button="true" can-swipe-back="false"> 
    <ion-content class="background-cntr" delegate-handle="mainScroll"> 
    SOME HTML CONTENT 
    </ion-content> 
    <ion-footer-bar> 
    <div class="list"> 
      <div class="item item-input-inset"> 
     <label class="item-input-wrapper"> 
      <input type="text"/> 
        <input type="text" style="display:none;"/> 
     </label> 
     <button>Test</button> 
     </div> 
    </div> 
    </ion-footer-bar> 
</ion-view>

Wer weiß, wie diese zu lösen?

Quelle

2016-10-19 Aleksandr Movsesyan

Ich habe die Lösung herausgefunden und es besser machen zu arbeiten. Anstatt alle Eingaben in der Fußzeile zu haben, füge ich sie jedes Mal hinzu und entferne sie. Auf diese Weise gibt es immer nur eine Eingabe in der Fußzeile. Dies scheint ziemlich gut zu funktionieren. Die zweite Sache, die ich getan habe, war, den Phantom-Tastatur-Fall zu behandeln, indem ich den folgenden Code dem Controller hinzufüge.

window.addEventListener('native.keyboardshow', function(){ 
    if (document.activeElement.nodeName !== "INPUT") { 
    var activeElement = document.querySelector("#chat_footer_inputs input"); 
    if (activeElement) { 
     activeElement.focus(); 
     $ionicScrollDelegate.scrollBottom(true); 
    } 
    } 
});

Quelle

2016-10-20 17:58:28

angular.module('ionicApp', ['ionic']) 
.factory('focus', function($timeout, $window) { 
     return function(id) { 
      $timeout(function() { 
       var element =  $window.document.getElementById(id); 
       if(element) 
        element.focus(); 
      }); 
     }; 
    }) 
.controller('MyCtrl', function($scope, focus) { 
focus("myInput") 

});

HTML

<html ng-app="ionicApp"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 

    <title>Input trouble on iOS</title> 

    <link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"> 
    <script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script> 

    </head> 
    <body ng-controller="MyCtrl"> 
    <ion-view title="COMPANY" hide-back-button="true" can-swipe-back="false"> 
     <ion-content class="background-cntr" delegate-handle="mainScroll"> 
     SOME HTML CONTENT 
     </ion-content> 
     <ion-footer-bar> 
     <div class="list"> 
       <div class="item item-input-inset"> 
      <label class="item-input-wrapper"> 
       <input type="text"/> 
         <input type="text" style="display:none;"/> 
      </label> 
      <button>Test</button> 
      </div> 
     </div> 
     </ion-footer-bar> 
    </ion-view> 

    </body> 
</html>

Quelle

2016-10-19 08:31:26

Das würde funktionieren, aber ich brauche den Benutzer, um den Fokus und nicht die js zu initiieren. Es wäre also am Tippen/Clcik. –

Ionic Framework iOS Eingabefokus Probleme

Antwort

Verwandte Themen