Програмний вибір тексту в полі введення на пристроях iOS (мобільне Safari)

Як ви програмно вибираєте текст поля введення на пристроях iOS, наприклад iPhone, iPad із мобільним Safari?

Зазвичай достатньо викликати .select()функцію на <input ... />елементі, але це не працює на цих пристроях. Курсор просто залишається в кінці існуючого запису без вибору.

input.setSelectionRange(0, 9999);

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

Ніщо в цій темі не працювало для мене, ось що працює на моєму iPad:

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

Важко довести негатив, але моє дослідження показує, що це помилка в Mobile Safari.

Зверніть увагу, що focus () працює більш-менш - хоча для успіху може знадобитися кілька натискань, і це не потрібно, якщо ви намагаєтеся відповісти на натискання користувача на поле, оскільки саме натискання дасть поле фокус. На жаль, виберіть () є просто непрацездатність Mobile Safari.

Найкращим вибором може бути звіт про помилку в Apple .

Дивіться цю скрипку : (введіть трохи тексту у поле введення та натисніть "вибрати текст")

Це виділення тексту у вікні вводу на моєму iPod (iOS 5.0 покоління, відкриття клавіатури), а також відображення меню Вирізати / Копіювати / Запропонувати ...

Використання простого javascript. Не пробував це з jQuery

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

Зверніть увагу, що число 999 - це лише зразок. Ви повинні встановити ці цифри на кількість символів, які потрібно вибрати.

ОНОВЛЕННЯ:

• iPod5 - iOS6.0.1 - Працює нормально.
• iPad1 - iOS5.1.1 - Вибрано лише текст. Натисніть виділення один раз, щоб відкрити меню Вирізати / Копіювати
• iPad2 - iOS4.3.3 - Вибрано лише текст. Торкніться виділення один раз, щоб відкрити меню Вирізати / Копіювати

Для останніх двох ви можете експериментувати, запускаючи подію клацання на inputелементі

ОНОВЛЕННЯ: (07-10-2013)

• iPod5 - iOS7.0.2 - Використання скрипки у посиланні: Неможливо побачити набраний текст у полі введення. Натискання select переспрямовує мене на facebook.com (??? wtf ???), не маючи уявлення, що там відбувається.

ОНОВЛЕННЯ: (14-11-2013)

• IOS 7.0.3: Завдяки коментарі від Бінкі поновлення , що .selectionStartі .selectionEnd робить роботу.

ОНОВЛЕННЯ: (15-01-2015)

• iOS 8.xx: Завдяки коментарю Майкла Зіберта . Взято з коментаря: Мені довелося прослуховувати події фокусування І клацання, а потім setTimeout / _.

На жаль, у своєму попередньому дописі я не помітив, що Javascript мав на увазі, що ви хочете отримати відповідь у Javascript.

Щоб отримати те, що ви хочете, в UIWebView за допомогою javascript , мені вдалося зібрати дві важливі частини інформації, щоб змусити її працювати. Не впевнений у мобільному браузері.

1. element.setSelectionRange(0,9999); робить те, що ми хочемо

2. Подія mouseUp скасовує виділення

Таким чином (з використанням прототипу):

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

робить трюк.

Метт

Схоже, фокус спрацює, але лише за умови безпосереднього виклику з власної події. фокус виклику, використовуючи щось на зразок SetTimeout, не з'являється, викликайте клавіатуру. Керування клавіатурою ios дуже погане. Це не хороша ситуація.

На Webkit, який постачається з Android 2.2, для мене працює щось на зразок наступного:

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

Див. Випуск Chromium 32865 .

З iOS 7 на iPad єдиним способом, яким я зміг зробити цю роботу, було використання власне <textarea></textarea>замість <input>поля.

напр

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

Як запобігти користувачеві змінювати текст усередині області було важче, оскільки ви робите текстове поле лише для читання, трюк виділення більше не спрацює.

Я з глузду з'їхав, шукаючи це рішення, тоді як всі ваші відповіді допомогли йому відкрити чергову банку глистів.

Клієнт хотів, щоб користувач міг натискати та вибирати все , а також дозволяв користувачеві "перекладати" та вибирати все на iPad (із зовнішньою клавіатурою. Знаю, божевільний ...)

Моїм рішенням цієї проблеми було переставити події. Перший фокус , а потім натисніть , потім touchstart .

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

Сподіваюся, це комусь допоможе, як ти багато допомагав мені незліченну кількість разів.

Якщо ви використовуєте браузери, сумісні з HTML5, ви можете використовувати їх placeholder="xxx"у своєму inputтегу. Це повинно зробити роботу.