Как сделать, что бы в переменную не записывались пустые значения?
Есть несколько блоков, которые перебираются циклом. В них содержатся инпуты и label, при нажатии на input, в консоль попадает input поле и label для него, в label нету атрибута value, а в input есть и в переменную я записываю значение атрибута value для input, но так как его нету в label, то в переменную попадает пустое значение.
И я решил сделать условие, что бы не попадало пустое значение, можно ли как то этот код улучшить?
<div class="options">
<input type="hidden" value="18" class="questionId" name="questionId">
<input type="radio" name="r-1" id="radio-1" value="1" title=""/>
<label for="radio-1" class="false-answer">Да</label>
<input type="radio" name="r-1" id="radio-2" value="2" title=""/>
<label for="radio-2" class="true-answer">Нет</label>
</div>
<div class="options">
<input type="hidden" value="17" class="questionId" name="questionId">
<input type="radio" name="r-2" id="radio-3" value="1" title=""/>
<label for="radio-3" class="false-answer">Да</label>
<input type="radio" name="r-2" id="radio-4" value="2" title=""/>
<label for="radio-4" class="true-answer">Нет</label>
<input type="radio" name="r-2" id="radio-5" value="3" title=""/>
<label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
</div>
<div class="options">
<input type="hidden" value="16" class="questionId" name="questionId">
<input type="radio" name="r-3" id="radio-6" value="1" title=""/>
<label for="radio-6" class="false-answer">Да</label>
<input type="radio" name="r-3" id="radio-7" value="2" title=""/>
<label for="radio-7" class="true-answer">Нет</label>
</div>
var ans = document.querySelectorAll('.options');
ans.forEach(function (element, i) {
ans[i].addEventListener('click', function (e) {
var inputs = e.target.closest('.options');
var idQuestion = inputs.getElementsByClassName("questionId")[0].value;
var answer = '';
if(e.target.hasAttribute('value')) {
answer = e.target.value;
}
else {
return; // что бы не попадало пустое значение
}
console.log(answer);
})
})
|
И зачем такие сложности.
var ans = document.querySelectorAll('.options');
ans.forEach(function (element) {
element.addEventListener('change', function (e) {
console.log(e.target) //это та радио кнопка, которую выбрали и значение которой является значением группы
})
})
|
DivMan,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class="options">
<input type="hidden" value="18" class="questionId" name="questionId">
<input type="radio" name="r-1" id="radio-1" value="1" title=""/>
<label for="radio-1" class="false-answer">Да</label>
<input type="radio" name="r-1" id="radio-2" value="2" title=""/>
<label for="radio-2" class="true-answer">Нет</label>
</div>
<div class="options">
<input type="hidden" value="17" class="questionId" name="questionId">
<input type="radio" name="r-2" id="radio-3" value="1" title=""/>
<label for="radio-3" class="false-answer">Да</label>
<input type="radio" name="r-2" id="radio-4" value="2" title=""/>
<label for="radio-4" class="true-answer">Нет</label>
<input type="radio" name="r-2" id="radio-5" value="3" title=""/>
<label for="radio-5" class="false-answer">Движение разрешено только по обочине.</label>
</div>
<div class="options">
<input type="hidden" value="16" class="questionId" name="questionId">
<input type="radio" name="r-3" id="radio-6" value="1" title=""/>
<label for="radio-6" class="false-answer">Да</label>
<input type="radio" name="r-3" id="radio-7" value="2" title=""/>
<label for="radio-7" class="true-answer">Нет</label>
</div>
<script>
var ans = document.querySelectorAll('.options');
ans.forEach(function (element, i) {
var idQuestion = element.querySelector(".questionId").value;
element.addEventListener('change', function (e) {
var answer = e.target.value;
console.log(idQuestion, answer)
})
})
</script>
</body>
</html>
|
Цитата:
|
рони,
а зачем так element.querySelector(".questionId").value;, если достаточно e.target.value;? |
Спасибо
|
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
|
| Часовой пояс GMT +3, время: 18:23. |