Тип ввода = число невозможно вставить отрицательные номера на мобильный телефон

Я тестирую свое приложение на своем мобильном телефоне (samsung galaxy note II с хромом), и у меня проблема с числовыми полями ввода.

В моем приложении эти поля могут принимать отрицательные числа, а в браузере все отлично, поскольку у меня есть кнопка -, а также слайдеры (из html5) для выбора номера.

На телефоне, хотя ползунки не отображаются, и браузер распознает тип ввода = номер и просто отображает упрощенную числовую клавиатуру, которая не содержит знака -, поэтому я не видел пути для вставки отрицательного числа, которое я желаю.

Мое приложение использует twitter bootstrap 2.3.2 с jquery, я не уверен, как решить эту проблему.

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

<input class="input-mini" data-type="distance_price" id="distance" label="false" name="distance" step="0.1" type="number" max="-0.1">

screenshot from my phone

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

Ответ 2

Сделайте дополнительное поле ввода. Флажок "Знак", выбор натуральных или отрицательных целых чисел.

Затем закрепите событие onchange, чтобы обновить числовое представление, чтобы отобразить выбранный знак.

Ответ 3

Короче говоря, нет никакого способа, чтобы знак минуса отображался на числовых входах Samsung Android. Вот несколько обходных решений, с которыми я столкнулся:

1) Клавиатура Google

Пользователь может установить другую клавиатуру (например, Google Keyboard). Очевидно, что это не идеально, если люди что-то устанавливают, хотя.

введите описание изображения здесь

2) Кнопка Negate

Как уже предложил @Cris, добавьте кнопку, которая будет отрицать значение. Если у вас есть экран недвижимости, то здорово.

3) Double Dot Trick

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

https://gist.github.com/bendytree/936f6b9b4c0e10138b7e9158b5fd05d9

Ответ 4

Если вы используете атрибут value (value = "- 0.1" ) для загрузки начального отрицательного значения, тогда у вас будет знак минус, предварительно загруженный для вас.

<input class="input-mini" data-type="distance_price" id="distance" label="false" name="distance" step="0.1" type="number" max="-0.1" value="-1">