Мне нужно знать разницу между этими двумя входами?

<input type="range" />


<input type="number" />

В чем разница !
Они оба представляют собой числовое поле ...!
Разница лишь в том, как они отображаются в браузере?

Диапазон = представлен с помощью ползунка или регулятора набора
число = числовой ввод с шаговыми стрелками

Большинство учебных сайтов сказали, что

разница между числом и диапазоном является точным значением числа неважно с диапазонами

Что означает это предложение?

-2
Karem Gmeay 27 Фев 2018 в 07:39

4 ответа

Лучший ответ

От https://developer.mozilla.org/en -US / Docs / Web / HTML / элемент / вход / диапазон

Элементы <input> типа "range" позволяют пользователю указывать числовое значение, которое должно быть не меньше заданного значения и не более другого заданного значения. Однако точное значение не считается важным.

Таким образом, основное различие между range и number состоит в том, что number для точных значений, тогда как range нет. Значения из range являются субъективными , тогда как значения из number являются объективными .

Примером, где точные значения являются не важными, может быть, если у вас есть палитра цветов. У вас есть 3 диапазона, представляющие красный, зеленый и синий цвета. Точное значение не так важно. Ваше приложение не взорвется, если вы выберете 156 для зеленого вместо 163.

Другим примером будет размер текста на странице. Пользователь может выбрать размер в диапазоне от 10 до 30pt. Если пользователь случайно выбрал 17 вместо 18, это не имеет значения. Текст выглядит немного меньше, но его все равно можно прочитать, и это не нарушает поток страницы.

Что касается значения, полученного сервером (поскольку вы пометили свой пост с помощью PHP), между ними нет никакой разницы. Однако сценарий использования <input type="range"> очень ограничен на стороне сервера. Почти каждый раз, когда вы запрашиваете номер у сервера, вам нужно точное и точное число, и все, что отличается, будет иметь последствия. Вы не хотели бы, чтобы диапазон выбирал, сколько предметов добавить в корзину, потому что случайное перемещение ползунка на несколько пикселей в одну сторону может привести к ужасным неожиданным последствиям. Я бы предположил, что диапазоны были бы более полезными для JavaScript, изменения настроек страницы на стороне клиента или любых субъективных пользовательских настроек, таких как внешний вид страницы.

Поэтому, если вы используете диапазон, спросите себя, что произойдет, если значение немного отличается. Если это не имеет большого значения, вы можете использовать диапазон. Если это так, перейдите к чему-то еще, например, <input type="number">.

0
Mike 27 Фев 2018 в 05:11

Вы можете вручную ввести желаемое число в number типе. Вы также получаете бесплатную проверку, если этот вход является числом. Также вы можете представить отрицательные значения с типом number. + вы можете поместить заполнитель в это поле.

С range вы получаете этот слайдер. Например, нет заполнителя, и вы не можете вручную (с помощью клавиатуры) вставить в него значение.

0
Learn on hard way 27 Фев 2018 в 04:44

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

Как вы видите сегодня, html5 может не только представлять текстовые данные, но также аудио и видео. Поэтому, если вы сталкиваетесь с аудиоданными, в основном вам необходимо использовать тип ввода «диапазон» для объявления громкости звука. Также, когда вы работаете над графиком статистики, где есть минимальное и максимальное значение для его. Это цель для его.

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

0
awim 27 Фев 2018 в 04:59

Я думаю, что вы только что ответили на свой вопрос:

диапазон = представлен с помощью ползунка или регулятора набора

число = числовой ввод с шаговыми стрелками

Разница лишь в том, как они отображаются в браузере. Они оба возвращают числовые значения.

0
Caleb Libby 27 Фев 2018 в 04:44