如何使用jQuery遍歷HTML頁面的所有選定元素

Question

我正在做一個測驗應用程序，我需要獲取所有選定的元素或用戶答案。 這些元素可以是單選輸入，復選框輸入或文本字段。 每個元素都分配有一個question_id屬性，answer_id和一個mark屬性。 我想做的是我必須獲取所有的question_id，answer_id和mark屬性，以便我可以計算分數，並將question_id和answer_id都發送到DB，以便我可以在特定問題下存儲相關的用戶答案。 我已經使用此代碼對模板進行了測驗。

$(data.quiztopics).each(function(index,element){
    $(element.questions).each(function(index,question){
        $(".quiz").append("<form name='question' class= question_"+question.id+"><input type='text' disabled value="+question.question_text+"/><br></form>");
        if(question.question_type=='NUM'){
            $(question.answers).each(function(index,answer){
                $(".question_"+question.id).append("<input type='radio' question_id='+question.id+'answer_id='+answer.id +'name='answer' class=answer_"+answer.id+" mark="+answer.marks+"value="+answer.answer_text+">"+answer.answer_text+"</input>")
            });
        }
        else if(question.question_type=='MCQ'){
            $(question.answers).each(function(index,answer){
                $(".question_"+question.id).append("<input type='checkbox' question_id='+question.id+'answer_id='+answer.id +' name='answer' class=answer_"+answer.id+">"+answer.answer_text+"</input>")
            });
        }
        else if(question.question_type=='FIB'){
            $(question.answers).each(function(index,answer){
                $(".question_"+question.id).append("<input type='text' question_id='+question.id+'answer_id='+answer.id +' name='answer' class=answer_"+answer.id+">"+answer.answer_text+"</input>")
            });
        }
    });
});

告訴我如何獲取所選元素的屬性以提交測驗。

Answer 1

我認為這可以做到：

var questions = {};

$(".quiz :selected, .quiz :checked, .quiz input[type=text]").each({
   var $this = $(this);
   var question = $this.attr('question_id');
   questions[question] = {
       answer: $this.attr('class'),
   };
});

Answer 2

它非常簡單，您只需要使用element.attr( attributeName )函數

jQuery文檔

一點JSFIddle助您一臂之力

alert("Radio Mark " + $("#one").attr('mark') + ", Radio Value " + $("#one").attr('value'));

alert("check Mark " + $("#two").attr('mark') + ", check Value " + $("#two").attr('value'));

Answer 3

我已經通過使用getElementsByName（'answer'）方法按名稱獲取DOM中所有可用元素的方式解決了此問題。 它返回給我一個列表，然后遍歷此列表，我檢查該元素是否被選中，如果被選中，則獲取它們的屬性。

attributes_list=new Array()
var answers=document.getElementsByName('answer');
for(i=0;i<answers.length;i++){
    if(answers[i].checked){
            question_id=answers[i].attributes['question_id'].value
            answer_id=answers[i].attributes['answer_id'].value
            attributes_list.push({'que':question_id,'ans':answer_id});
        }
}