How to check the values of multiple dynamic radio buttons in a form using jquery

Question

I am trying to make a quiz system. I have created dynamic radio buttons. Now I want to check the values of selected radio buttons. How can I do that?

 function createquestionpaper(qlist)
    {
        var questionform = $('#quesform');
        var quesNum = 1;
        $.each(qlist, function (index, val) {
            var questionstring = '<div class="form-group" ><label class="control-label" id="'+val.Question_ID+'">'+quesNum+'. '+val.Question1+'</label>'+
                                  '<div class="radio"><input type="radio" name="'+val.Question_ID+'" value="1">'+val.Option1+'</div>' +
                                   '<div class="radio"><input type="radio" name="' + val.Question_ID + '" value="2">' + val.Option2 + '</div>' +
                                  '<div class="radio"><input type="radio" name="' + val.Question_ID + '" value="3">' + val.Option3 + '</div>' +
                                  '<div class="radio"><input type="radio" name="' + val.Question_ID + '" value="4">' + val.Option4 + '</div>' +
                                  '</div><hr>';
            questionform.append(questionstring);
            quesNum = quesNum + 1;

        });

Answer 1

Because the other answers didn't mention a solution for checking all values at the same time:

// right answers
var solutions = [1,3,1,1,2,3,4];
// all answers from all questions (get all checked radio-inputs, then get all values)
var valuesForAllQuestions = $('.form-group', '#quesform').find('input:radio:checked').map(function() {return $(this).val()}).get();
// map them to points (1=correct answer, 0=false), then reduce it to a sum
var correct = valuesForAllQuestions.map((answer, idx)=>(answer==solutions[idx]?1:0)).reduce((sum, actual)=>sum+actual,0);

Answer 2

您可以使用jquery选择器找出被选择的那个并获取其值：

$('input[name=yourQuestionID]:checked').val()

Answer 3

You can iterate over $('input[type=radio]:checked')

 $('#done').on('click', function() { $('input[type=radio]:checked').each(function() { console.log('Question:', this.name, 'Answer:', this.value) }); }); 

 input[type=radio] { display: inline-block; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h3>Question 1</h3> 1. <input type="radio" name="q1" value="1" /> 2. <input type="radio" name="q1" value="2" /> 3. <input type="radio" name="q1" value="3" /> 4. <input type="radio" name="q1" value="4" /> <h3>Question 2</h3> 1. <input type="radio" name="q2" value="1" /> 2. <input type="radio" name="q2" value="2" /> 3. <input type="radio" name="q2" value="3" /> 4. <input type="radio" name="q2" value="4" /> <h3>Question 3</h3> 1. <input type="radio" name="q3" value="1" /> 2. <input type="radio" name="q3" value="2" /> 3. <input type="radio" name="q3" value="3" /> 4. <input type="radio" name="q3" value="4" /> <button id="done">Done</button>