Получить value из radio button и сохранить в переменной

Question

Есть функция которая выполняет "все" что мне нужно. Имитирует работу фокуса при выборе карточки. Но я хотел бы еще получать value инпута который выбираю.

const element = document.querySelectorAll('.element');
const radioBtn = document.querySelectorAll('.radioBtn');

const getCheckedValue = (...values) => {
const [collection, radioBtn] = values;
  collection.forEach((item, i) => item.addEventListener('click', function () {
    radioBtn[i].checked = 'checked';
    collection.forEach(item => item.classList.remove('focus'));
    item.classList.add('focus');

  }));
}

const values = getCheckedValue(element, radioBtn);

console.log(values);

.focus {
  background: #FF0000 !important;
  opacity: .9;
  transition: all .4s ease 0s;
}

.block {
display: flex;
}

.element {
background: #000;
width: 50px;
height: 50px;
margin-right: 10px;
  cursor: pointer;
}

<input class="radioBtn" type="radio" value="Корпоративная" name="radioBtn">
<input class="radioBtn" type="radio" value="Частная" name="radioBtn">


<div class="block">
<div class="element"></div>
<div class="element"></div>
</div>

Даже если реализовать получение значения в отдельной функции ...

const radioBtn = document.querySelectorAll('.radioBtn');

let result;
radioBtn.forEach(el => el.addEventListener('change', function () {
  if (el.checked === true) {
    result = el.value;
    console.log(result);
  }

}))

console.log(result);

<input class="radioBtn" type="radio" value="Корпоративная" name="radioBtn">
<input class="radioBtn" type="radio" value="Частная" name="radioBtn">

Я могу вывести только в консоль, но не сохранить в переменную.

И плюс ко всему если я нажимаю именно на элемент (и передаю el.checked = true), а не на сам инпут onchange не отрабатывает.

Answer 1

Метод forEach ничего не возвращает, его используют только для перебора. Он не может вернуть вам значение и поместить его в переменную.

БЛОГ НА HUSL

Получить value из radio button и сохранить в переменной

Ответы (1 шт):