Как отключить клавиатуру iPhone для указанного поля ввода на веб-странице

Question

Я использую ввод месяца (как в jQuery UI datepicker) для поля срока действия кредитной карты.

Мне нужно отключить клавиатуру iPhone, потому что она скрывает средство выбора месяца.

Я попытался установить поле только для чтения, и это неприемлемое решение - в Safari iOS 5.1 поля только для чтения пропускаются при навигации по клавиатуре (кнопки "предыдущий / следующий" на клавиатуре). Размытие поля также недопустимо, потому что оно запускает проверку (мы также используем проверку JQuery).

Есть ли способ отключить клавиатуру iPhone на одном поле, не устанавливая ее только для чтения или размывая ее?

Answer 1

Я не сталкивался с тем, чтобы спрятать клавиатуру. Но вы подумали, альтернативный способ отображения "вход". Один вариант будет использовать <input type="month" /> который приносит родной месяц выбора в iOS5.

Второй вариант будет стиль, например. элемент span в качестве элемента ввода (-webkit-Appearance не работает на iOS) и добавление tabindex для элемента. Это также может сработать, хотя я не знаю, какой инструмент выбора месяца вы используете.

Третий вариант - вы не можете предотвратить процесс проверки, когда размытие поля запускается вручную?

Answer 2

У меня была та же проблема в Drupal, где поля ввода будут динамически добавляться, поэтому я добавил несколько js, проверил наличие Iphone/Ipad и добавил свойство "только для чтения"

var checkUserAgent = navigator.userAgent;
    if (checkUserAgent.match(/iPad/i) || checkUserAgent.match(/iPhone/i)) {
        var checkBabyId1 = $('#babys_due_date_id').length > 0;
        if (checkBabyId1 == true) {
            $('#babys_due_date_id').find('input').prop('readonly', true);
        }
    }