мое новое расписание: пн-пт с 8.00 по 16.00 по москве, сб и вс - выходные; после 16.00 и на вых. отвечаю по возможности

Работа с радиокнопками в JavaScript

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

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

<input type="radio" name="elem"> <input type="radio" name="elem"> <input type="radio" name="elem">

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

<input type="radio" name="elem" value="1"> <input type="radio" name="elem" value="2"> <input type="radio" name="elem" value="3">

Чтобы сделать какую-нибудь радиокнопку отмеченной по умолчанию, ей необходимо задать атрибут checked:

<input type="radio" name="elem" value="1" checked> <input type="radio" name="elem" value="2"> <input type="radio" name="elem" value="3">

Давайте посмотрим на практике, как работать с такими кнопками на JavaScript. Пусть у нас есть представленная выше группа радиокнопок, а также обычная кнопка:

<input type="submit" id="button">

Давайте сделаем так, чтобы по нажатию на кнопку на экран вывелось value той радиокнопочки, которая отмечена в данный момент.

Для решения задачи необходимо перебрать все наши радиокнопочки циклом и определить, какая из них выбрана. Для этого нужно прочитывать значение свойства checked каждой из перебираемых радиокнопок. У которой это свойство равно true - та радиокнопочка и выбрана.

Реализуем описанное:

let radios = document.querySelectorAll('input[type="radio"]'); let button = document.querySelector('#button'); button.addEventListener('click', function() { for (let radio of radios) { if (radio.checked) { console.log(radio.value); } } });

Даны 3 радиокнопки, абзац и кнопка. По клику на кнопку выведите в абзац value отмеченной радиокнопки.