zoukankan      html  css  js  c++  java
  • jquery获取连续的单选钮,复选框。。值

    开发考试系统时用于获取考生的答案进行判分

    页面的代码(使用freemarker)

                <div class="SJ_main">
                    <#--第一步:对单选题进行分页处理-->
                    <#if (pageNum1>=1)>
                    <#list 1..pageNum1 as pages1> 
                    <div class="page" id="page${pages1}">
                        <div class="page_main">
                            <div class="page_main_content_TX">
                                
                                <p>一.单项选择题部分    本题型共${subNum1}题    共${pageNum1}页</p>
                                </div>
                            <div class="page_main_content">
                                <ul>
                                    <#list singleSubList as sl>
                                    <#if ((pages1-1)*5)<=sl_index&&sl_index<=(pages1*5-1)>
                                    <li>
                                        ${sl_index+1}. ${sl.singTitle}<font color="#999999">[${singleScoreList[sl_index]}分]</font>.
                                        <input type="hidden" name="singScore${sl_index+1}" value="${singleScoreList[sl_index]}"/>
                                        <input type="hidden" name="singAnswer${sl_index+1}" value="${sl.singAnswer}"/>
                                        <ul>
                                            <li>
                                                <input type="radio"  name="singSub${sl_index+1}" value="A" onFocus="doSing(${sl_index+1})" />
                                                A.${sl.singA}
                                            </li>
                                            <li>
                                                <input type="radio"  name="singSub${sl_index+1}" value="B" onFocus="doSing(${sl_index+1})" />
                                                B.${sl.singB}
                                            </li>
                                            <li>
                                                <input type="radio"  name="singSub${sl_index+1}" value="C" onFocus="doSing(${sl_index+1})" />
                                                C.${sl.singC}
                                            </li>
                                            <li>
                                                <input type="radio"  name="singSub${sl_index+1}" value="D" onFocus="doSing(${sl_index+1})" />
                                                D.${sl.singD}
                                            </li>
                                            <#if sl.singE?exists>
                                            <li>
                                                <input type="radio"  name="singSub${sl_index+1}" value="E" onFocus="doSing(${sl_index+1})" />
                                                E.${sl.singE}
                                            </li>
                                            </#if>
                                        </ul>
                                    </li>
                                    </#if>
                                    </#list>
                                </ul>
                            </div>
                        </div>
                        
                        <#--以下为分页标签-->
                        <div class="psge_yewei" style="color:#999999">
                            <span>${pages1}/${totalPage}</span>
                            <span>
                                <a onclick="javascript:displayPage(${pages1-1})">上一页</a>
                            </span>
                            <span>
                                <a onclick="javascript:displayPage(${pages1+1})">下一页</a>
                            </span>
                        </div>
                    </div>
                    </#list>
                    </#if>
                    
                    
                    
                    <#--第二步:对多选题进行分页处理-->
                    <#if (pageNum2>=1)>
                    <#list 1..pageNum2 as pages2> 
                    <div class="page" id="page${pages2+pageNum1}">
                        <div class="page_main">
                            <div class="page_main_content_TX">
                                <p>二.多项选择题部分    本题型共${subNum2}题    共${pageNum2}页</p>
                               </div>
                            <div class="page_main_content">
                                <ul>
                                    <#list moreSubList as ml>
                                    <#if ((pages2-1)*5)<=ml_index&&ml_index<=(pages2*5-1)>
                                    <li>
                                        ${subNum1+ml_index+1}. ${ml.moreTitle}<font color="#999999">[${moreScoreList[ml_index]}分]</font>
                                        <input type="hidden" name="moreScore${ml_index+1}" value="${moreScoreList[ml_index]}"/>
                                        <input type="hidden" name="moreAnswer${ml_index+1}" value="${ml.moreAnswer}"/>
                                        <ul>
                                            <li>
                                                <input type="checkbox" name="moreSub${ml_index+1}" value="A" onclick="doMore(${ml_index+1},${ml_index+1+subNum1})" />
                                                A.${ml.moreA}
                                            </li>
                                            <li>
                                                <input type="checkbox" name="moreSub${ml_index+1}" value="B" onclick="doMore(${ml_index+1},${ml_index+1+subNum1})" />
                                                B.${ml.moreB}
                                            </li>
                                            <li>
                                                <input type="checkbox" name="moreSub${ml_index+1}" value="C" onclick="doMore(${ml_index+1},${ml_index+1+subNum1})" />
                                                C.${ml.moreC}
                                            </li>
                                            <li>
                                                <input type="checkbox" name="moreSub${ml_index+1}" value="D" onclick="doMore(${ml_index+1},${ml_index+1+subNum1})" />
                                                D.${ml.moreD}
                                            </li>
                                            <#if ml.moreE?exists>
                                            <li>
                                                <input type="checkbox" name="moreSub${ml_index+1}" value="E" onclick="doMore(${ml_index+1},${ml_index+1+subNum1})" />
                                                E.${ml.moreE}
                                            </li>
                                            </#if>
                                        </ul>
                                    </li>
                                    </#if>
                                    </#list>
                                </ul>
                            </div>
                        </div>
                        
                        <#--以下为分页标签-->
                        <div class="psge_yewei">
                            <span>${pages2+pageNum1}/${totalPage}</span>
                            <span>
                                <a onclick="javascript:displayPage(${pages2+pageNum1-1})">上一页</a>
                            </span>
                            <span>
                                <a onclick="javascript:displayPage(${pages2+pageNum1+1})">下一页</a>
                            </span>
                        </div>
                    </div>
                    </#list>
                    </#if>
                    
                    
                    
                    <#--第三步:对配比题进行分页处理-->
                    <#if (pageNum3>=1)>
                    <#list 1..pageNum3 as pages3> 
                    <div class="page" id="page${pages3+pageNum1+pageNum2}">
                        <div class="page_main">
                            <div class="page_main_content_TX">
                                <p style="font-family:宋体,Arial,sans-serif;">三. 配比选择题部分    本题型共${subNum3}题    共${pageNum3}页</p>
                               </div>
                            <div class="page_main_content">
                                <ul>
                                    <#list matchSubList1 as ml1>
                                    <#if ((pages3-1)*5)<=ml1_index&&ml1_index<=(pages3*5-1)>
                                    <li>                                
                                        ${ml1_index+1+subNum1+subNum2}. ${ml1.title} <font color="#999999">[${matchScoreList1[ml1_index]}分]</font>.
                                        <input type="hidden" name="matchScore1${ml1_index+1}" value="${matchScoreList1[ml1_index]}"/>
                                        <input type="hidden" name="matchAnswer1${ml1_index+1}" value="${ml1.answer}"/>
                                        <ul>
                                            <li>
                                                1)${ml1.opa}</br>
                                                &nbsp;&nbsp;<select id="" name="match1${ml1_index+1}" onchange="doMatch1(${ml1_index+1},${ml1_index+1+subNum1+subNum2})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                    <option value="E" style="color:#000000;">E</option>
                                                </select>
                                            </li>
                                            <li>
                                                2)${ml1.opb}</br>
                                                &nbsp;&nbsp;<select id="" name="match1${ml1_index+1}" onchange="doMatch1(${ml1_index+1},${ml1_index+1+subNum1+subNum2})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                    <option value="E" style="color:#000000;">E</option>
                                                </select>
                                            </li>
                                            <li>
                                                3)${ml1.opc}</br>
                                                &nbsp;&nbsp;<select id="" name="match1${ml1_index+1}" onchange="doMatch1(${ml1_index+1},${ml1_index+1+subNum1+subNum2})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                    <option value="E" style="color:#000000;">E</option>
                                                </select>
                                            </li>
                                            <li>
                                                4)${ml1.opd}</br>
                                                &nbsp;&nbsp;<select id="" name="match1${ml1_index+1}" onchange="doMatch1(${ml1_index+1},${ml1_index+1+subNum1+subNum2})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                    <option value="E" style="color:#000000;">E</option>
                                                </select>
                                            </li>
                                            <li>
                                                5)${ml1.ope}</br>
                                                &nbsp;&nbsp;<select id="" name="match1${ml1_index+1}" onchange="doMatch1(${ml1_index+1},${ml1_index+1+subNum1+subNum2})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                    <option value="E" style="color:#000000;">E</option>
                                                </select>
                                            </li>
                                        </ul>
                                    </li>
                                    </#if>
                                    </#list>
                                </ul>
                            </div>
                        </div>
                        
                        <#--以下为分页标签-->
                        <div class="psge_yewei" style="color:#999999">
                            <span>${pages3+pageNum1+pageNum2}/${totalPage}</span>
                            <span>
                                <a onclick="javascript:displayPage(${pages3+pageNum1+pageNum2-1})">上一页</a>
                            </span>
                            <span>
                                <a onclick="javascript:displayPage(${pages3+pageNum1+pageNum2+1})">下一页</a>
                            </span>
                        </div>
                    </div>
                    </#list>
                    </#if>
                    
                    <#--第四步:对比较题进行分页处理-->
                    <#if (pageNum4>=1)>
                    <#list 1..pageNum4 as pages4> 
                    <div class="page" id="page${pages4+pageNum1+pageNum2+pageNum3}">
                        <div class="page_main">
                            <div class="page_main_content_TX">
                                <p>四.比较选择题部分    本题型共${subNum4}题    共${pageNum4}页</p>
                               </div>
                            <div class="page_main_content">
                                <ul>
                                    <#list matchSubList2 as ml2>
                                    <#if ((pages4-1)*5)<=ml2_index&&ml2_index<=(pages4*5-1)>
                                    <li>
                                        ${ml2_index+1+subNum1+subNum2+subNum3}. ${ml2.title}<font color="#999999">[${matchScoreList2[ml2_index]}分]</font>
                                        <input type="hidden" name="matchScore2${ml2_index+1}" value="${matchScoreList2[ml2_index]}"/>
                                        <input type="hidden" name="matchAnswer2${ml2_index+1}" value="${ml2.answer}"/>
                                        <ul>
                                            <li>
                                                1)${ml2.opa}</br>
                                                &nbsp;&nbsp;<select id="" name="match2${ml2_index+1}" onchange="doMatch2(${ml2_index+1},${ml2_index+1+subNum1+subNum2+subNum3})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                </select>
                                            </li>
                                            <li>
                                                2)${ml2.opb}</br>
                                                &nbsp;&nbsp;<select id="" name="match2${ml2_index+1}" onchange="doMatch2(${ml2_index+1},${ml2_index+1+subNum1+subNum2+subNum3})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                </select>
                                            </li>
                                            <li>
                                                3)${ml2.opc}</br>
                                                &nbsp;&nbsp;<select id="" name="match2${ml2_index+1}" onchange="doMatch2(${ml2_index+1},${ml2_index+1+subNum1+subNum2+subNum3})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                </select>
                                            </li>
                                            <li>
                                                4)${ml2.opd}</br>
                                                &nbsp;&nbsp;<select id="" name="match2${ml2_index+1}" onchange="doMatch2(${ml2_index+1},${ml2_index+1+subNum1+subNum2+subNum3})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                </select>
                                            </li>
                                            <li>
                                                5)${ml2.ope}</br>
                                                &nbsp;&nbsp;<select id="" name="match2${ml2_index+1}" onchange="doMatch2(${ml2_index+1},${ml2_index+1+subNum1+subNum2+subNum3})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="B" style="color:#000000;">B</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                                    <option value="D" style="color:#000000;">D</option>
                                                </select>
                                            </li>
                                        </ul>
                                    </li>
                                    </#if>
                                    </#list>
                                </ul>
                            </div>
                        </div>
                        
        
                        <div class="psge_yewei" style="color:#999999">
                            <span>${pages4+pageNum1+pageNum2+pageNum3}/${totalPage}</span>
                            <span>
                                <a onclick="javascript:displayPage(${pages4+pageNum1+pageNum2+pageNum3-1})">上一页</a>
                            </span>
                            <span>
                                <a onclick="javascript:displayPage(${pages4+pageNum1+pageNum2+pageNum3+1})">下一页</a>
                            </span>
                        </div>
                    </div>
                    </#list>
                    </#if>
                    
                    
                    <#--第五步:对判断题进行分页处理-->
    
                        
                    <#if (pageNum5>=1)>
                    <#list 1..pageNum5 as pages5> 
                    <div class="page" id="page${pages5+pageNum1+pageNum2+pageNum3+pageNum4}">
                        <div class="page_main">
                            <div class="page_main_content_TX">
                                <p>五.判断题<small>(A为true,C为false)</small> 共${subNum5}题   ${pageNum5}页</p>
                               </div>
                            <div class="page_main_content">
                                <ul>
                                    <#list judgeSubList as jl>
                                    <#if ((pages5-1)*5)<=jl_index&&jl_index<=(pages5*5-1)>
                                    <input type="hidden" name="judgeScore${jl_index+1}" value="${judgeScoreList[jl_index]}"/>
                                    <input type="hidden" name="judgeAnswer${jl_index+1}" value="${jl.answer}"/>
                                    <li>
                                        ${jl_index+1+subNum1+subNum2+subNum3+subNum4}. ${jl.title}<font color="#999999">[${judgeScoreList[jl_index]}分]</font></br>
                                            &nbsp;&nbsp;&nbsp;&nbsp;
                                            <select id="judge${jl_index+1}" name="judge${jl_index+1}" onchange="doJudge(${jl_index+1},${jl_index+1+subNum1+subNum2+subNum3+subNum4})" style="color:#cccccc;">
                                                    <option value="0" style="color:#cccccc;">请选择</option>
                                                    <option value="A" style="color:#000000;">A</option>
                                                    <option value="C" style="color:#000000;">C</option>
                                            </select>
                                    </li>
                                    </#if>
                                    </#list>
                                </ul>
                            </div>
                        </div>
                        
                        
                        <div class="psge_yewei" style="color:#999999">
                            <span>${pages5+pageNum1+pageNum2+pageNum3+pageNum4}/${totalPage}</span>
                            <span>
                                <a onclick="javascript:displayPage(${pages5+pageNum1+pageNum2+pageNum3+pageNum4-1})">上一页</a>
                            </span>
                            <span>
                                <a onclick="javascript:displayPage(${pages5+pageNum1+pageNum2+pageNum3+pageNum4+1})">下一页</a>
                            </span>
                        </div>
                    </div>
                    </#list>
                    </#if>

    点击后通过js获取所有的答案:包括单选钮(单选题),复选框(多选题),下拉框(判断题,等)
    js代码(只有关键代码):由于是多个值因此必须根据name来获得值

    for (i = 1; i <= singSize; i++) { // 计算单选题
                        doAnswer = $("input[name=singSub" + i + "]:checked").val();
                        rightAnswer = $("input[name=singAnswer" + i + "]").val();
                        //alert("单选"+doAnswer+"   "+rightAnswer);
                        if (doAnswer == rightAnswer) {
                            totalScore += new Number($("input[name = singScore" + i + "]")
                                    .val());
                        }
                    }
                    for (i = 1; i <= moreSize; i++) { // 计算多选题
                        doAnswer = "";
                        rightAnswer = "";
                        rightAnswer = $("input[name=moreAnswer" + i + "]").val();
                        $("input[name=moreSub" + i + "]:checked").each(function(i, obj) {
                            doAnswer += $(obj).val();
                        });
                        //alert("多选"+doAnswer+"   "+rightAnswer);
                        if (doAnswer == rightAnswer) {
                            totalScore += new Number($("input[name=moreScore" + i + "]")
                                    .val());
                        }
                    }
                    for (i = 1; i <= matchSize1; i++) { // 计算配比题
                        doAnswer = "";
                        rightAnswer = "";
                        rightAnswer = $("input[name=matchAnswer1" + i + "]").val();
                        var score = $("input[name = matchScore1" + i + "]").val();
                        //alert("正确答案 = " +rightAnswer + "分值   = "+score+"000");
                        $("select[name = match1" + i + "]").each(function(){
                            doAnswer += $(this).val();
                        });
                        //alert(doAnswer);
                        if(doAnswer == rightAnswer){
                            totalScore+=new Number(score);
                        }
                    }
                    for (i = 1; i <= matchSize2; i++) { // 计算比较题
                        doAnswer = "";
                        rightAnswer = "";
                        rightAnswer = $("input[name = matchAnswer2" + i + "]").val();
                        var score = $("input[name = matchScore2" + i + "]").val();
                        //alert("正确答案 = " +rightAnswer + "分值   = "+score+"111");
                        $("select[name = match2" + i + "]").each(function(){
                            doAnswer += $(this).val();
                        });
                        //alert(doAnswer);
                        if(doAnswer == rightAnswer){
                            totalScore+=new Number(score);
                        }
                    }
                    for (i = 1; i <= judgeSize; i++) { // 计算判断题
                        doAnswer = "";
                        rightAnswer = "";
                        doAnswer = $("#judge"+i+"").val();
                        alert(doAnswer);
                        rightAnswer = $("input[name=judgeAnswer" + i + "]").val();
                        var score = $("input[name = judgeScore" + i + "]").val();
                        //alert("选择题正确答案是=  "+rightAnswer+"  分值"+$("input[name = judgeScore" + i + "]").val()+  "实际答案 = "+$("#judge"+i+"").val());
                        if(doAnswer == rightAnswer){                //每一位进行比较是否相同
                            //alert("得分是 = "+totalScore);
                            totalScore+=new Number(score);            
                        }
                    }
  • 相关阅读:
    如何配置MySQL
    软件工程第三次作业
    软件工程第二次作业
    软件工程第一次作业
    Python 【面试总结】
    Vue【你知道吗?】
    Python 【面试强化宝典】
    Python 【基础面试题】
    Vue 【前端面试题】
    Redis 【常识与进阶】
  • 原文地址:https://www.cnblogs.com/shenliang123/p/2452888.html
Copyright © 2011-2022 走看看