Код?... Это просто!
php js Jquery JsPhp blog
ТЕГИ:
js (87)

php (101)
js (87)
php date (19)
html (14)
online (14)
js slice (13)
encode (11)
js array (11)
php array (10)
js date (10)
engine (10)
hash (10)
dosite (9)
info (7)
php img (7)
jsphp (6)
Показать еще :

Узнать нажатый radio

Как "узнать нажатый radio js". У вас возникла задача определить какой из кнопок радиоточки(type="radio") был нажат.

Отслеживаем нажатие на type="radio"

  1. Html код "узнать нажатый radio js"
  2. javascript код "узнать нажатый radio js"
  3. Код в сборе "узнать нажатый radio js"
  4. Пример как "узнать нажатый radio js"
  1. Html код "узнать нажатый radio js"

    Для того, чтобы узнать "чекнутый"(нажатый) "radio"(радиоточку) вам понадобится собрать html код:

    Html:

    Создадим несколько input

    С type="radio".

    + Потребуется атрибут name у всех одинаковый.

    + Атрибут value с разными значениями:

    <input type="radio" name="example" value="красный" > красный

    <input type="radio" name="example" value="синий" > синий

    <input type="radio" name="example" value="желтый" > желтый

    Далее тег button по которому будем отслеживать нажали или нет радиоточку.

    Чтобы обратиться к тегу по id используем id.

    <button id="click_button">Определить </button>

    Соберем весь код:

    Html код в сборе "узнать нажатый radio js"

    <input type="radio" name="example" value="красный" > красный

    <input type="radio" name="example" value="синий" > синий

    <input type="radio" name="example" value="желтый" > желтый

    <button id="click_button">Определить </button>

  2. Javascript код "узнать нажатый radio js"

    После того, как вы разобрались с кодом html "для отслеживания нажатия радиоточки приступим к коду javascript"... для создания такого кода вам понадобится:

    Тег script.

    Обращаемся к тегам input с помощью getElementsByName, передаем полученную " коллекцию " в переменную.

    var the_obj = document.getElementsByName('example');

    Используем один из способов onclick:

    click_button .onclick = function()

    В цикле for перебираем данную коллекцию. Если нажатый "радио" в данной коллекции найдется, то останавливаем цикл break и выведем значение из value с помощью alert:

    for ( var i = 0; i < the_obj.length; i++)

    {

    if(the_obj[i].checked)

    {

    alert(the_obj[i].value);

    break;

    }

    }

    Соберем весь код:

    Javascript код в сборе "узнать нажатый radio js"

    <script>

    var the_obj = document.getElementsByName('example');

    click_button .onclick = function()

    {

    for ( var i = 0; i < the_obj.length; i++)

    {

    if(the_obj[i].checked)

    {

    alert(the_obj[i].value);

    break;

    }

    }

    };

    </script>

  3. Код в сборе "узнать нажатый radio js".

    И далее, теперь уже соберем весь код "узнать нажатый radio js" в одном месте:

    Html:

    <input type="radio" name="example" value="красный" > красный

    <input type="radio" name="example" value="синий" > синий

    <input type="radio" name="example" value="желтый" > желтый

    <button id="click_button">Определить </button>

    Javascript:

    <script>

    var the_obj = document.getElementsByName('example');

    click_button .onclick = function()

    {

    for ( var i = 0; i < the_obj.length; i++)

    {

    if(the_obj[i].checked)

    {

    alert(the_obj[i].value);

    break;

    }

    }

    };

    </script>

  4. Пример как "узнать нажатый radio js"

    Вам осталось поместить выше приведенный код "узнать нажатый radio js" в сборе прямо здесь и протестировать его работоспособность.

    Для того, чтобы проверить будет ли определяться нажатый "type="radio" вам нужно выбрать одну из радиоточек, нажать её и нажать кнопку "Определить":

    красный

    синий

    желтый

jsphp.ru есть здесь:
Полезные ссылки:
ruweb
Я писал немного о ruweb.net!
Помочь проекту JsPhp.ru

Что можно сделать!?

Поделиться ссылкой! C друзьями или врагами!


Помочь проекту JSPHP.RU: Помочь проекту JSPHP.RU прокомментировать :

Скоро...


Мои Проекты :

Скоро...



О хостинге :

Скоро...


© jsphp.ru 2023 - 2024 , Аминев Марат. Контакты
Страница загружена за : 0.005862 секунд.