Programmgesteuertes Auswählen von Text in einem Eingabefeld auf iOS-Geräten (mobile Safari)

Wie wählen Sie programmgesteuert den Text eines Eingabefelds auf iOS-Geräten aus, z. B. iPhone, iPad, auf dem Mobile Safari ausgeführt wird?

Normalerweise reicht es aus, die .select()Funktion für das <input ... />Element aufzurufen , dies funktioniert jedoch auf diesen Geräten nicht. Der Cursor bleibt einfach am Ende des vorhandenen Eintrags, ohne dass eine Auswahl getroffen wird.

input.setSelectionRange(0, 9999);

https://developer.mozilla.org/en/DOM/Input.select

Nichts in diesem Thread hat für mich funktioniert. Folgendes funktioniert auf meinem iPad:

// t is the input field
setTimeout(function() {
    t.setSelectionRange(0, 9999);
}, 1);

Es ist schwer, ein Negativ zu beweisen, aber meine Forschung legt nahe, dass dies ein Fehler in Mobile Safari ist.

Beachten Sie, dass focus () mehr oder weniger funktioniert - obwohl mehr als ein Tippen erforderlich sein kann, um erfolgreich zu sein, und es nicht erforderlich ist, wenn Sie versuchen, auf ein Tippen eines Benutzers auf das betreffende Feld zu antworten, da das Tippen selbst das Feld angibt Fokus. Leider wählen () ist einfach nicht funktional in Mobile Safari.

Ihre beste Wahl ist möglicherweise ein Fehlerbericht mit Apple .

Sehen Sie sich diese Geige an : (Geben Sie Text in das Eingabefeld ein und klicken Sie auf "Text auswählen".)

Es wählt Text in einem Eingabefeld auf meinem iPod (5. Generation iOS6.0.1) aus, öffnet die Tastatur und zeigt auch das Menü Ausschneiden / Kopieren / Vorschlagen ... an

Verwenden von einfachem Javascript. Habe dies nicht mit jQuery versucht

document.getElementById("p1").selectionStart = 0
document.getElementById("p1").selectionEnd = 999

Beachten Sie, dass die Nummer 999 nur ein Beispiel ist. Sie sollten diese Zahlen auf die Anzahl der Zeichen einstellen, die Sie auswählen möchten.

AKTUALISIEREN:

• iPod5 - iOS6.0.1 - Funktioniert einwandfrei.
• iPad1 - iOS5.1.1 - Nur Text ausgewählt. Tippen Sie einmal auf Auswahl, um das Menü Ausschneiden / Kopieren zu öffnen
• iPad2 - iOS4.3.3 - Nur Text ausgewählt. Tippen Sie einmal auf Auswahl, um das Menü Ausschneiden / Kopieren zu öffnen

In den letzten beiden Fällen können Sie experimentieren, indem Sie ein Klickereignis für das inputElement auslösen

UPDATE: (07-10-2013)

• iPod5 - iOS7.0.2 - Verwenden der Geige im Link: Eingegebener Text im Eingabefeld wird nicht angezeigt. Durch Drücken von Auswahl werde ich zu facebook.com (??? wtf ???) weitergeleitet. Keine Ahnung, was dort los ist.

UPDATE: (14-11-2013)

• iOS 7.0.3: Dank des Kommentars von Binki Update, dass das .selectionStartund .selectionEnd funktioniert .

UPDATE: (15-01-2015)

• iOS 8.xx: Dank des Kommentars von Michael Siebert . Aus dem Kommentar entnommen: Ich musste sowohl auf Fokus- als auch auf Klickereignisse warten und dann setTimeout / _. Debounce ausführen, damit es in beiden Fällen funktioniert: Klicken Sie auf die Eingabe oder den Fokus durch Tabulieren

Entschuldigung, in meinem früheren Beitrag habe ich das Javascript nicht bemerkt, was bedeutet, dass Sie eine Antwort in Javascript wollten.

Um das zu erreichen, was Sie in UIWebView mit Javascript wollen , habe ich es geschafft, zwei wichtige Informationen zusammen zu kratzen, damit es funktioniert. Ich bin mir nicht sicher über den mobilen Browser.

1. element.setSelectionRange(0,9999); macht was wir wollen

2. Das mouseUp-Ereignis macht die Auswahl rückgängig

Also (unter Verwendung des Prototyps):

    input.observe ('focus', function () {
      this.setSelectionRange (0, 9999);
    });
    input.observe ('mouseup', Funktion (Ereignis) {
      event.stop ();
    });

macht den Trick.

Matt

Es sieht so aus, als würde der Fokus funktionieren, aber nur, wenn er direkt von einem nativen Ereignis aufgerufen wird. Wenn Sie den Fokus mit SetTimeout aufrufen, wird die Tastatur nicht aufgerufen. Die Steuerung der iOS-Tastatur ist sehr schlecht. Es ist keine gute Situation.

In Webkit, das mit Android 2.2 geliefert wird, funktioniert für mich Folgendes:

function trySelect(el) {
    setTimeout(function() {
        try {
            el.select();
        } catch (e) {
        }
    }, 0);
}

Siehe Chromium- Ausgabe 32865 .

Mit iOS 7 auf dem iPad war die einzige Möglichkeit, diese Arbeit zu machen, die Verwendung <textarea></textarea>anstelle von <input>Feld.

z.B

<textarea onclick="this.setSelectionRange(0, 9999);">My text will be selected when textarea is clicked.</textarea>

Es war schwieriger zu verhindern, dass der Benutzer den Text innerhalb des Bereichs ändert, da der Auswahltrick nicht mehr funktioniert, da Sie den Textbereich schreibgeschützt machen.

Ich war verrückt nach dieser Lösung, während all Ihre Antworten mir geholfen haben, eine weitere Dose Würmer für mich zu öffnen.

Der Client wollte, dass der Benutzer in der Lage ist , alle zu klicken und auszuwählen , und dass der Benutzer auf dem iPad (mit einer externen Tastatur. Ich weiß, verrückt ...) "Tab" und alle auswählen kann .

Meine Lösung für dieses Problem war, die Ereignisse neu zu ordnen. Erster Fokus , dann klicken , dann Berührungsstart .

$('#myFUBARid').on('focus click touchstart', function(e){
  $(this).get(0).setSelectionRange(0,9999);
  //$(this).css("color", "blue");
  e.preventDefault();
});

Ich hoffe, das hilft jemandem, denn Sie haben mir unzählige Male geholfen.

Wenn Sie HTML5-kompatible Browser verwenden, können Sie diese placeholder="xxx"in Ihrem inputTag verwenden. Das sollte den Job machen.