Сделайте так, чтобы кнопки «Предыдущая / Следующая» работали на флажках на iOS

Question

В iOS при заполнении формы на веб-странице на клавиатуре есть кнопки «Далее» и «Назад», которые действуют как клавиша табуляции на реальной клавиатуре. У нас есть веб-приложение, которое я реализовал как приложение, использующее PhoneGap, а кнопки «Далее» и «Предыдущий» пропускают мимо флажков, как будто их там нет.

Есть ли способ заставить кнопки Next и Previous работать с флажками с помощью PhoneGap / UIWebView / Safari на iOS?

Answer 1

Это может быть смоделировано с использованием только HTML.

Вставьте элемент ввода текста непосредственно перед флажком.Добавьте JavaScript, поэтому нажатие клавиши, когда этот ввод имеет фокус, меняет состояние флажка.

Вот пример jsbin , который вы можете редактировать из источника .Примечания к этому примеру:

• не использовать <fieldset> - выбор текста с помощью длинного прикосновения к вводу принудительно закрывает iOS 6 в режиме редактирования jsbin (должно быть некоторое взаимодействие сjsbin code или iframe) и всегда скрывает каретку (что звучит полезно для этой ситуации, но не так!).Похоже, из-за плохой ошибки в Safari (но я на самом деле не изучал ее и не сообщал об этом, поскольку слишком много хлопот).

• идея visibility:hidden;использование элемента <option> не работает, потому что, если пользователь касается параметра, клавиатура скрывается.

• Я не тратил много времени на поиск хорошего стиля для целенаправленного использования.чекбокс - если кто-нибудь придумает что-нибудь получше, пожалуйста, прокомментируйте.

• В примере jsbin есть несколько ненужных вещей для идей, которые не сработали, чтобы скрыть мигающую каретку.Мне было бы интересно, если есть более аккуратное решение для сокрытия каретки.

• Должен быть какой-то браузер, сниффинг, чтобы применить это исправление только к устройствам iOS.

• это не стандартное поведение пользовательского интерфейса iOS, поэтому может запутать пользователей при переходе в другие приложения или иметь другие негативные последствия.Решение может быть легко взломано будущими выпусками Mobile Safari.

• Я пробовал несколько разных способов скрыть каретку, и наиболее эффективным представляется использование -webkit-transform: scale(0.01); transform: scale(0.01);.Используя размер шрифта: 1px;почти работает, но заставляет iPhone масштабироваться, когда ввод получает фокус (тестировал iPad iOS5, но он не масштабировался, тестировал iPhone iOS6 и увеличивал масштаб).

Answer 2

Краткий ответ: «Это особенность».Это просто так, возможно, потому что Apple не хочет, чтобы люди путали, какую кнопку им нужно нажимать, чтобы установить флажок.