потеря фокуса ввода текста при появлении клавиатуры - Приложение iOS PhoneGap

У меня возникла проблема при разработке приложения для телефона на iOS 7 с использованием Cordova 2.7 с вводом текста в формате html. когда я выбираю ввод текста, появляется клавиатура. но не могу ничего напечатать, так как фокус потерян. я должен выбрать снова, чтобы ввести текст.

может ли кто-нибудь помочь мне в этом.


ios cordova textfield lostfocus
person abduIntegral    schedule 30.01.2014    source источник

Ответы (5)


arrow_upward
11
arrow_downward

Я столкнулся с аналогичной проблемой, когда клавиатура появлялась, но в текстовом поле ничего не отображалось. Мой был вызван css -

* {
  -webkit-user-select: none; /* prevent copy paste */
}

Я исправил проблему, переопределив стиль для текстовых полей -

input[type="text"] {
    -webkit-user-select: text;
}
person mld    schedule 04.02.2014
comment
это мне не поможет. Вы знаете, как остановить изменение размера экрана при появлении программной клавиатуры? - person abduIntegral; 10.02.2014
comment
Я нашел несколько человек, которые упомянули, что добавили max-scale=1 в свой метатег области просмотра, и позаботились об этой проблеме. Это не работает для меня, так как мое приложение предназначено только для мобильных устройств, а iOS7 работает с экстремальным увеличением при установке на iPad. - person mld; 10.02.2014
comment
На самом деле я недавно заметил эту проблему в iOS 10 и 11. Кажется, это исправлено. - person Rozgonyi; 25.10.2017
comment
Мне это не помогло, но замена * на html помогла. - person Firze; 02.01.2018
comment
Спасибо, у меня была та же проблема, что и у вас, и это решило ее. - person FreeZey; 23.03.2019
comment
Для KeyboardDisplayRequiresUserAction установлено значение false. Добавил этот CSS. Этот ответ не исправит это для меня. Когда я нажимаю на несфокусированное поле, курсор ненадолго появляется, а затем исчезает, а клавиатура остается. Еще нужно коснуться ее еще раз, чтобы курсор снова появился в поле. - person Mozfet; 28.01.2020

arrow_upward
2
arrow_downward

Внутри приложений Cordova есть файл конфигурации, config.xml, где по умолчанию Cordova не позволяет вам управлять фокусом из вызовов javascript, это означает, что клавиатура может «исчезнуть».

Измените это:

<preference name="KeyboardDisplayRequiresUserAction" value="true" />

to

<preference name="KeyboardDisplayRequiresUserAction" value="false" />

а затем просто напишите обработчик событий для поля, в котором он устанавливает фокус на себя при нажатии внутри setTimeout. Это сработало очень хорошо для меня в последнее время.

person Sam-Graham    schedule 18.08.2014
comment
Это позволяет сфокусироваться и заставить клавиатуру отображаться в фокусе, однако, когда вы затем щелкаете в несфокусированном поле, курсор ненадолго появляется, а затем исчезает, а клавиатура остается. - person Mozfet; 28.01.2020

arrow_upward
1
arrow_downward

Это известная проблема, которая уже зарегистрирована в Cordova здесь: https://issues.apache.org/jira/browse/CB-5115. Я также хотел бы найти обходной путь, поскольку он не идеален.

Вот обходной путь, как описано там,

window.document.body.ontouchstart = (e) => {
  if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') {
    e.preventDefault();
    e.target.focus();
  }
};
person keldar    schedule 30.01.2014
comment
Есть ли какой-нибудь трюк, чтобы преодолеть это, пока они не исправят это. - person abduIntegral; 30.01.2014

arrow_upward
0
arrow_downward

Я столкнулся с этой проблемой и обнаружил, что исправил ее в другом проекте Phonegap, используя это. Это в основном то же самое, что и ответ @mld, но с использованием html. Использование * не работает для моего приложения на iOS.

html {
  -webkit-user-select: none; /* prevent text selection */
}

input[type="text"] {
    -webkit-user-select: text;
}
person Firze    schedule 02.01.2018

arrow_upward
0
arrow_downward

У меня была эта проблема в проекте Ionic V1/Angular 1.5. Это исправление сработало для меня:

window.addEventListener('native.keyboardshow', function () {
  if ( document.activeElement != document.getElementById('my-input') && document.activeElement.nodeName != 'INPUT' ){
    document.getElementById('my-input').focus()
  }
});

Когда мы нажимаем на ввод, появляется клавиатура. Затем мы можем проверить, действительно ли наш элемент ввода сфокусирован. Если нет, то фокусируем вручную. Если это другой ввод, мы не будем его фокусировать.

Я вызвал это внутри функции $onInit моего компонента — не забудьте удалить прослушиватель событий, когда ваш компонент уничтожается с помощью $onDestroy. Это также предполагает, что вы используете плагин ionic-plugin-keyboard.

Это хорошо работает с одним вводом, но если у вас есть несколько вводов на одной странице, вам, вероятно, потребуется дополнительная логика, чтобы приложение не фокусировалось на неправильном вводе при открытии клавиатуры.

person Matt Cassara    schedule 03.01.2018