Всех друзей поздравляем с Новым годом! Всего вам самого наилучшего! Всех благ, здоровья а материальное приложится!
СКРИПТЫ althtmlcssphpjsblog

Получение данных из type range javascript

Поддержи проект!!! smile

Нам нужно получить данные из type range в javascript. Для этого нам потребуется:
<input type="range">

Получение данных из type range javascript

  1. Получение данный из range в javascript
  2. Скрипт в сборе получение данный из range в javascript
  3. Скачать можно здесь
  1. Получение данный из range в javascript

    Для того, чтобы собрать наш показательный стенд, нам понадобится:

    Тег - input

    С type="range"

    Добавим id, чтобы можно было обратиться к тегу.

    Поставим value на отметку 50 - половину от максимального, чтобы ползунок стоял ровно на половине.

    Добавим min="0" - минимальное значение - позиция слева.

    max="100" - максимальное значение позиция справа.

    step="1" - шаг при движении

    Добавим oninput - с функцией внутри.

    oninput="fun()"

    Основной ползунок собрали!

    <input type="range" min="0" max="100" step="1" value="50" id="id_range" oninput="fun()">

    Соберем куда будем передавать полученные данные :

    Это будет div

    Добавим id - send_result.

    Внутрь помести среднее значение 50.

    Результат:
    <div id="send_result">50</div>
    javascript

    Соберем код для сбора и передачи данных

    Куда отправляем - send_result.innerHTML - innerHTML

    Что отправляем - id_range.value - value в js

    Соберем вместе:

    <script>

    function fun() {

    send_result.innerHTML=id_range.value;

    }

    </script>

  2. Скрипт в сборе получение данный из range в javascript

    Соберем весь код получение данный из range в javascript вместе!

    Заметьте - казалось бы, какой простой код, и сколько пунктов нам нужно было пройти, чтобы собрать его!

    Html :

    <input type="range" min="0" max="100" step="1" value="50" id="id_range" oninput="fun()">

    <div id="send_result">50</div>

    <script>

    function fun() {

    send_result.innerHTML=id_range.value;

    }

    </script>

    Результат Чтобы протестировать работу - отправки и получения данных из range в javascript - перетащите ползунок в какое-то новое положение и вы увидите, как изменяется показания снятые из input range
    50


Вас может еще заинтересовать список тем : #JS | #TYPE_RANGE |
Последняя дата редактирования : 19.01.2021 22:22
Название скрипта :Получить данные из ползунка javascript
Скрипт № 67.2Ссылка на скачивание : Все скрипты на одной странице
//dwweb.ru/comments_1_5/include/img/hand_no_foto.png
no
no
Еще никто не прокомментировал! COMMENTS+   BBcode
аватар
🞨
Загрузить свой аватар
(max ширина, высота = 200px)

Подписаться + =
Теги:
type range javascript Получение данных из type range javascript

Последние комментарии :
Марат :
19/01/2021 01:13
Всегда пожалуйста!Приходите ещё!
подробнее.
аркадий :
19/01/2021 01:08
Спасибо!Меню вернулось. Класс!
подробнее.
Прохожий :
02/01/2021 10:44
Здравствуйте Марат!Спасибо Вам, за оперативность и развернутый ответ с примерами. И ОГРОМНОЕ спасибо, что…
подробнее.
Марат :
01/01/2021 03:30
И вас с Новым годом!Посмотрите …
подробнее.
Прохожий :
31/12/2020 03:58
А как проверить, чекнут ли чекбокс программно, то есть - другим скриптом, а не мышкой?Вот тут…
подробнее.