Сравните значение выбранного переключателя

Question

У меня есть код для переключателя. Когда конкретный пользователь выбирает вторую радиокнопку (значение = «Selection_MQ--»), тогда мне нужно проверить, выбрал ли пользователь эту конкретную кнопку, а затем отобразить сообщение с предупреждением о правильном ответе, а если выбрать первый (значение = «Selection_MA- - "), то неверный ответ. как я могу это сделать?

<td valign="center"><input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MA--" /></td> 
     <td valign="center"><span class="answer text">No</span></td> 
<td valign="center"><input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MQ--" /></td> 
     <td valign="center"><span class="answer text">Yes</span></td> 
var Answer_1_data = $('input[name="Answer_1"]:checked').val(); 

Answer 1

Если у вас есть радиокнопки с тем же именем, пользователи могут выбирать только один, так что эта часть проста. Все, что вам нужно сделать, это показать правильное сообщение, в зависимости от того, какой из них проверен. Все просто javascript.

// Object with correct answers 
 
var answers = { 
 
    Answer_1: 'Selection_MQ--' 
 
} 
 

 
// Function to check if answers are correct 
 
function checkAnswer(){ 
 
    alert(this.value == answers[this.name]? 'Correct!' : 'Wrong :-('); 
 
} 
 

 
// Attach listeners to radio buttons 
 
window.onload = function() { 
 
    [].forEach.call(document.querySelectorAll('input[name="Answer_1"]'), function (radio){ 
 
    radio.addEventListener('click',checkAnswer, false); 
 
    }); 
 
};

<fieldset><legend>Questions</legend> 
 
<label for="Answer_1a"><input type="radio" class="question selection" name="Answer_1" id="Answer_1a" value="Selection_MA--">No</label> 
 
<label for="answer_1b"><input type="radio" class="question selection" name="Answer_1" id="Answer_1b" value="Selection_MQ--">Yes</label> 
 
</fieldset>

Это является хорошим кандидатом для делегации, где радиомодемы завернутые в FIELDSET и одного слушателя помещенного на FIELDSET, чтобы проверить ответы, а не помещая слушателя на каждой кнопке радио ,

Answer 2

Использование Jquery

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript"> 
     $(document).ready(function(){ 
     $("input[type='button']").click(function(){ 
var Answer_1_data = $('input[name="Answer_1"]:checked').val(); 
if(Answer_1_data){ 
       if(Answer_1_data=="Selection_MQ--") 
       alert("Correct Anwser"); 
      else 
       alert("Wrong Answer"); 
      } 
     }); 

    }); 
</script> 
<td valign="center"> 
<input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MA--" /></td> 
     <td valign="center"><span class="answer text">No</span></td> 
<td valign="center"> 
<input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MQ--" /></td> 
     <td valign="center"><span class="answer text">Yes</span></td> 
     <input type="button" id="btn" value="Submit"> 

Использование Javascript

<script type="text/javascript"> 
     function answer() 
     { 
      var ans = document.getElementsByName('Answer_1'); 

for (var i = 0, length = ans.length; i < length; i++) { 
    if (ans[i].checked) { 
     if((ans[i].value)=="Selection_MQ--") 
     alert("Correct Answer"); 
     else 
      alert("Wrong ANswer"); 
    } 
} 
     } 
</script> 
<td valign="center"> 
<input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MA--" /></td> 
     <td valign="center"><span class="answer text">No</span></td> 
<td valign="center"> 
<input type="radio" class="question selection" name="Answer_1" id="Answer_1" value="Selection_MQ--" /></td> 
     <td valign="center"><span class="answer text">Yes</span></td> 
     <input type="button" id="btn" value="Submit" onclick="answer()"> 

Answer 3

// возвращает истину, если переключатель проверяется в противном случае ложной

function radioButtonIsChecked(radioButton) { 
    if (radioButton.is(':checked') { 
     return true; 
    } else { 
     return false; 
    } 
} 

// получить кнопку радио элемент значение

function getRadioButtonValue(radioButton) { 
    if (radioButtonIsChecked(radioButton) { 
     return radioButton.val(); 
    } else { 
     return null; 
    } 
} 


// try the code 
for (var i = 0; i < $('input[name="Answer_1"] ').length; i++) { 

    if ("Selection_MQ--" == getRadioButtonValue( $('#Answer_' + i)) { 
     alert("Correct Answer"); 
    } else { 
     alert("wrong answer"); 
    } 
}