2015-11-25 3 views
1

Я пытаюсь выяснить, как проверить и записать на консоль, если выбран вариант в форме радио. Я продолжаю получать «Не проверено», даже если выбран правильный параметр. Любые идеи? Я бы предпочел решение, которое не включает JQuery, поскольку я изучаю HTML и JavaScript.Получение данных с помощью переключателя

Спасибо!

<body> 
<form id="office"> 
    <label id="ques1"> question 1</label><br/> 
     <div class="q1 wrong q1a1"><input type="radio" name="question1" value="q1a1" /> Answer1 <br/></div> 
     <div class="q1 wrong q1a2"><input type="radio" name="question1" value="q1a2" /> Answer2 <br/></div> 
     <div class="q1 wrong q1a3"><input type="radio" name="question1" value="q1a3" /> Answer3 <br/></div> 
     <div class="q1 right q1a4"><input type="radio" name="question1" value="q1a4" /> Answer4 <br/></div> 

      <br/><br/> 

    <input type="submit" id="submit" name="submitAnswers" value="Submit Your Answers" onclick="checkFunction()" /> 


</form> 


<script type="text/javascript"> 

window.onload = function() { 

document.getElementById('submit').onclick = function() { 
if (document.querySelector('.q1 wrong q1a1').checked == true) { 
    console.log('checked'); 
} else { 
    console.log('not checked'); 
} 
}; 
}; 
</script> 
</body> 
+0

Один из ошибки в коде был 'document.querySelector (». Q1 неправильно q1a1') 'не будет доступен, его будет выглядеть как 'document.querySelector ('. q1.wrong.q1a1')', но что вы хотите точно? –

ответ

2

Вы проверки, если <div> проверяется, не радио-кнопки.

Изменить эту строку:

if (document.querySelector('.q1 wrong q1a1').checked == true) { 

к чему-то вроде:

if (document.querySelector('input[type=radio][name=question1]').checked == true) { 
+1

... или 'document.querySelector ('input [name =" question1 "]: checked'). Value;' –

+0

@Pamblam. Хорошо. Вероятно, это лучше, если есть другие '.q1a1' s. –

+0

Большое спасибо за ваши ответы! Я попробовал первый вариант и получил «Не могу прочитать свойство», отмеченное «null». Когда я попробовал "('input [name =" question1 "]: checked')" Я получил "Uncaught ReferenceError: checkFunction не определен" Любые другие варианты? Спасибо – user3185970

0

У вас есть небольшая ошибка в селекторе вы передаете функции querySelector. Каждое имя класса, которое находится в div, должно быть добавлено с помощью . Селектор должен выглядеть следующим образом: .q1.wrong.q1a1. И тогда вы можете посмотреть на вход, который находится внутри этого DIV в качестве такого .q1.wrong.q1a1 input

window.onload = function() { 
    document.getElementById('submit').onclick = function() { 
    if (document.querySelector('.q1.wrong.q1a1 input').checked == true) { 
     console.log('checked'); 
    } else { 
     console.log('not checked'); 
    } 
    } 
} 
Смежные вопросы