Ответ 1

Если ваш код выполняется через то, что было инициировано с помощью действия пользователя, оно будет работать.

например,

это работает (клавиатура pops):

<input type='text' id='foo'><div onclick='$("#foo").focus();'>click</div>

это не работает (ввод получает границу, но не клавиатура):

<input type='text' id='foo'>
<script>
  window.onload = function() {
    $("#foo").focus();
  }
</script>

Ответ 2

Поместите прозрачную текстовую область над элементом contentEditable. Клавиатура откроется, как только пользователь начнет фокусировать текстовое поле.

Зарегистрируйте event listener в текстовом поле для события focus и установите visibility в textarea на hidden. Это предотвращает мигающий курсор.

Установите visibility текстового поля на visible после события blur.

Зарегистрируйте дополнительные прослушиватели событий для событий keydown, keyup, keypress и обработайте тезисы так же, как вы обрабатываете их в div content.ditable.

Ответ 3

Я обнаружил, что вызов prompt("Enter some value") запускает клавиатуру на моем iPad 2. Не уверен, что это полезно в вашей ситуации или нет.

Ответ 4

Чтобы показать клавиатуру на устройствах iOS, вам нужно сосредоточиться на редактируемом элементе, таком как input или textarea. Кроме того, элемент должен быть видимым, а функция .focus() должна выполняться в ответ на взаимодействие с пользователем, например щелчок мышью.

Дело в том, что мы не хотим, чтобы элемент ввода был видимым. Я немного поиграл с этим в течение некоторого времени и в итоге получил результат, который я искал.

Сначала создайте элемент, который вы хотите использовать, чтобы показать клавиатуру - в данном случае кнопку и скрытый элемент ввода: (Работает jsFiddle или Тест на мобильном устройстве)

<button id="openKeyboard">Open Keyboard</button>
<input id="hiddenInput" style="visibility: hidden;">

Затем используйте следующий javascript:

document.getElementById('openKeyboard').addEventListener('click', function(){
    var inputElement = document.getElementById('hiddenInput');
    inputElement.style.visibility = 'visible'; // unhide the input
    inputElement.focus(); // focus on it so keyboard pops
    inputElement.style.visibility = 'hidden'; // hide it again
});

Примечания:

• Я заметил, что сафари iOS автоматически прокручивается и масштабируется до области ввода, поэтому убедитесь, что вы используете правильный viewport и позиционируете свой элемент ввода в соответствующем месте.
• Вы можете использовать некоторый CSS на своем входе, например, установить opacity, height и width на 0. Однако, если ваш ввод полностью скрыт, это не будет работать снова, поэтому убедитесь, что вы оставите padding или border просто так, чтобы что-то отображалось (хотя оно не будет отображаться из-за непрозрачности). Это также означает, что вы не должны использовать display:none, чтобы скрыть его, скрытые элементы просто не могут быть сфокусированы.
• Используйте обычные события клавиатуры (keydown, keypress, keyup) на своем скрытом входе для доступа к пользовательскому взаимодействию, как обычно. Здесь ничего особенного.

Ответ 5

Ответы на эти вопросы предполагают, что это невозможно: Почему @contenteditable не работает на iPhone?

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

Ответ 6

Вот решение для вас:

<input id="my-input" type="text" />

<script type="text/javascript">
    var textbox = document.getElementById('my-input');
    textbox.select();
</script>

Ответ 7

Прокси-вводный трюк

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

1. Добавьте небольшой "прокси-невидимый вход" в левом верхнем углу страницы с фиксированной позицией (фиксированное положение предотвращает мерцание, также убедитесь, что поле имеет размер шрифта больше 16 пикселей, чтобы предотвратить увеличение фокуса страницы iOS)
2. При нажатии кнопки просто .focus() в этом невидимом поле. Клавиатура откроется...
3. Показывать или отображать другие поля ввода
4. Теперь, когда клавиатура открывает только .focus() на нужном входе. Вы можете использовать небольшую задержку setTimeout, например 500 мс