Die Tastatur umfasst eine Texteingabe in der webapp ( iOS )

Arbeite ich an einer webapp mit zwei input-Felder in der unteren Hälfte des Bildschirms. Die übergeordnete Ansicht ist absolut positioniert auf den Bildschirm. Normalerweise würde man davon ausgehen, beim klicken auf das Eingabefeld, das den Fokus zwingen würde, die Eingang in anzeigen oberhalb der Tastatur. Aber die Tastatur ist für die Eingabe-Feld.

Wenn ich mit der Eingabe beginnen, nichts ist Eingabe in das Feld. Um die Art im Feld, die ich getroffen habe, um den nächsten Pfeil, und dann wird die Vorherige Taste (> auf " gehe zu Feld #2 dann < zurück auf Feld 1), um den Eingang in Sicht.

Ich habe versucht, die Anpassung der Ansicht-overflow-scroll, position relative und programmgesteuert Fokus auf Tippen Sie auf. Keine dieser Lösungen zu arbeiten. Ich kann leider nur Antworten bezüglich UITextViews und Menschen, die das genaue Gegenteil Probleme (also nicht wollen, dass es automatisch scrollt.)

Jemals eine Lösung für dieses? Ich habe das gleiche problem. Ich habe ein bisschen ein hack mit scrollTop, aber es ist inkonsistent. Es funktioniert für einige Felder und andere.

InformationsquelleAutor Alex W | 2013-09-20

3

Einfache Lösung für alle interessierten:

Registrieren onfocus Veranstaltung auf die Eingänge, die Sie wollen immer zu sehen, wie im Beispiel unten. Da wir nicht wissen, wenn die Tastatur nicht vollständig erbracht, wird der code ausgeführt, für alle 300 Millisekunden 5 mal (Dauer von 1,5 Sekunden). Sie können es anpassen, um Ihren eigenen Geschmack.

Nur ein Nachteil dieser Lösung ist, dass es stützt sich auf scollIntoView was funktioniert vielleicht nicht auf einigen alten Browsern (siehe http://caniuse.com/#search=scrollIntoView). Natürlich können Sie ersetzen Sie es mit einem gleichwertigen Algorithmus das gleiche Ergebnis zu erzielen. Trotzdem, diese einfache Lösung sollte Ihnen die Idee.

JS:
```
var scrolling = function(e, c) {
  e.scrollIntoView();
  if (c < 5) setTimeout(scrolling, 300, e, c + 1);
};
var ensureVisible = function(e) {
  setTimeout(scrolling, 300, e, 0);
};
```
HTML:
```
<p>Some text here</p>
<input type="text" value="focus me" onfocus="ensureVisible(this)" />
<p>Some text here</p>
<input type="text" value="select me" onfocus="ensureVisible(this)" />
```
InformationsquelleAutor coolersport
1

Ohne reduzierten code-Beispiel es ist schwer zu sagen, aber Sie könnten versuchen, registrieren Sie einen click-handler, der auf das erste Feld, und dann konzentrieren Sie das zweite Feld, und dann das erste Feld wieder, die in jQuery würde das so Aussehen:
```
$('#first_field').on('click', function(){
  $('#second_field').focus();
  $('#first_field').focus();
});
```
Chancen sind, wird es nicht funktionieren, aber einen Versuch ist es Wert. Ansonsten müssen Sie starten, messing mit CSS und die Positionierung. Leider in einigen Fällen WebKit auf iOS buggy ist, wenn es um die Neupositionierung und Zoomen Sie das Fenster, um zu zeigen, Eingabefelder und die Tastatur.

InformationsquelleAutor thomasfuchs
1

Hier ein Zitat aus einer Antwort auf eine ähnliche Frage bei Scrollen, um das ausgewählte element während der Eingabe auf dem iphone safari virtuelle Tastatur

"Ok, so ist dies wahrscheinlich der schlechteste hack, die Sie jemals sehen, aber es schlägt nichts.

Was Sie tun können, ändern Sie die position des Textfeldes dynamisch (mit javascript) zu festen, position:fixed, das wird sich ändern, die position des textbox-Steuerelements relativ zum browser-Fenster anstelle von der Seite. Sollte dieses Rendern auf dem Iphone scrollen irrelevant und Ihren text-box sollte an der Spitze der Seite, egal was ist. Dann onBlur, die css-position festgelegt ist, um relativ wieder (das sollte ihn wieder an seinen Platz).

Machen diese schöner könnte man ein div hinter dem Textfeld onFocus so verbirgt Sie die eigentliche Website-content, und man konnte Mitte der textbox mit der top und left-css-Eigenschaften (nur stellen Sie sicher, dass diejenigen, die zu onBlur)."
- Danke, aber das problem mit dem HTML-input-tag, nicht eine native UITextField
- Ah ich sehe. Lassen Sie mich tun, etwas mehr Forschung dann.
InformationsquelleAutor Michael King
0

Hier ist eine Lösung, die getestet ok für beide native und Drittanbieter-Tastatur:
```
    $('#foo').on('blur',function(){
        setTimeout(function(){
            window.scrollTo(0,document.body.clientHeight); 
　　  }, 300); 
    });

    $('#foo').on('focus',function(){
        setTimeout(function(){
            window.scrollTo(0,100000);
        }, 300); 

    });
```
$('#foo') ist das input-element haben Sie Problem mit, der Schlüssel hier ist, um eine settimeout-Verzögerung für das Dokument scrollen. Denn wir brauchen einige Zeit, damit die ios-Tastatur popup schließt, um die richtige Dokument einen Bildlauf nach oben popoup.

InformationsquelleAutor SkuraZZ

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.