Как ввести поле ввода как числовое, так и пароль?

Я знаю об этом:

<input type="tel">

и я знаю об этом:

<input type="password">

Но я бы хотел использовать оба. Я хочу, чтобы цифровая клавиатура появилась на iOS (в частности), но скрывала каждый символ после его ввода. Возможно ли подобное?

<input type="tel|password">

Ответ 1

Для iOS вы можете установить вход для ввода "пароль" и по-прежнему запускать цифровую клавиатуру с помощью шаблона HTML5 "Атрибут":

<input type="password" pattern="[0-9]*" ... />

Из Apple-документации:

Чтобы отобразить числовую клавиатуру, установите для атрибута pattern значение "[0-9]" или "\ d".

Ответ 2

Html поля ввода:

<input type="tel" name="password" id="password" value="" placeholder="Enter password"
    onfocus="changeToPassword()">

JavaScript:

// change the type of the input to password
function changeToPassword() {
    setTimeout(function () {
        document.getElementById("password").setAttribute("type", "password")
    }, 500);
}

это решение работает на iphone. Это своего рода хак. После того, как у вас есть номерная панель в течение следующих 500 миллисекунд, вы меняете атрибут на пароль и трюки с телефоном.

Ответ 3

Вы можете ввести пароль типа ввода, а затем использовать javascript для проверки того, что были введены только цифры, когда была нажата кнопка отправки. http://www.configure-all.com/javascript_form_validation.php