Не работают ли сенсорные события с элементами ввода текста в iPad Safari?

Question

В iPad Safari я запрограммировал события касания DIV, чтобы при касании внутри DIV и удерживании там пальца в течение 500 мс цвет фона DIV изменялся.

Когда я пытаюсь переместитькод для элемента ввода текста (внутри набора полей), что делает его сенсорной целью вместо DIV, код не работает.Ввод текста становится выбранным, несмотря на этот CSS:

    input[type=text] {-webkit-touch-callout:none; -webkit-user-select:none }

Нет ли способа перехватить события касания элемента ввода текста в iPad Safari и обработать их произвольным образом, предотвращая поведение по умолчанию?Или я должен сделать что-то еще, чтобы получить поддержку?Я пробовал с фиктивным обработчиком кликов и без него: onclick = "void (0)".

Это документ, за которым я следую документации Обработка событий .

Answer 1

Попробуйте отключить и сделать ваш ввод доступным только для чтения:

<input type="text" readonly />

Answer 2

Если вы не вызываете preventDefault() в своем коде обработчика, браузер автоматически передает событие касания в реализацию по умолчанию (после того, как вы думаете, что обработали его). Реализация по умолчанию состоит в выборе поля.

Итак, в вашем случае, вызовите preventDefault() и stopPropagation() в вашем обработчике и верните false. Это предотвращает дальнейшее всплескивание события. Тогда вы можете полностью контролировать свой элемент ввода.

Предостережение: Вы также потеряете поведение по умолчанию для поля ввода! Другими словами, вы не сможете вводить текст в поле! Или, если поле ввода - <select>, вы не сможете открыть список и т. Д.

Полагаю, вы действительно хотите: 1) Если пользователь нажимает и удерживает в течение 500 мс, затем желтеет, 2) и / или при отпускании активирует поле ввода. В этом случае вам придется вручную переопределить событие вверх, если вы действительно хотите использовать поле ввода.

Такая ситуация очень распространена при программировании iPad. Например, во многих случаях вы хотели бы обнаружить движение с помощью сенсорного перетаскивания (даже в поле ввода) и интерпретировать его как движение, но интерпретировать движение с отпуском касания (без перемещения) как щелчок, чтобы активировать поле ввода , Вы должны сделать то, что я предлагаю выше: preventDefault() и обновить событие при необходимости.

Answer 3

Было бы полезно, если бы вы опубликовали свой код, но я думаю, что вам, вероятно, просто нужно предотвратить поведение по умолчанию для сенсорных событий.Это выглядит примерно так при использовании jQuery:

$("#ID")
        .bind("touchstart",
            function (e) {
                e.preventDefault();
                //do something
            })
        .bind("touchmove",
            function (e) {
                if (e.preventDefault) { 
                    e.preventDefault();
                }
                //do something
            });