验证动态创建的复选框组

时间:2013-06-11 05:26:15

标签: javascript jquery html xml

我已经使用Xml文件动态构建了一个表,用于多选项问题,输入类型为复选框而不是单选按钮。

我想知道如何限制用户只检查有选项的问题中的一个复选框

我的xml文件预览

<QA id="1">
        <number>1</number>
        <q><![CDATA[ <span id="q">Which of the Following is Called "SHRIMP CAPITAL OF INDIA"?</span>]]></q>
        <inputType><![CDATA[ <input type = "checkbox"  name="UserID" >]]></inputType> 
         <a><![CDATA[ <label>Stratosphere</lable>]]></a>
         <a><![CDATA[ <label>Troposphere</lable>]]></a>
         <a><![CDATA[ <label>Mesosphere</lable>]]></a>
         <a><![CDATA[ <label>Thermosphere</lable>]]></a>
</QA>

<QA id="2">
        <number>2</number>
        <q><![CDATA[ <span id="q">Which of the Following is Called "SHRIMP CAPITAL OF INDIA"?</span>]]></q>
        <inputType><![CDATA[ <input type = "checkbox"  name="UserID1">]]></inputType> 
         <a><![CDATA[ <label>GOA_MANGLORE</lable>]]></a>
         <a><![CDATA[ <label>ROHA-MANGLORE</lable>]]></a>
         <a><![CDATA[ <label>KANYAKUMARI-MANGLORE</lable>]]></a>
         <a><![CDATA[ <label>KANYAKUMARI-MUMBAI</lable>]]></a>

动态表的

脚本......

<script type="text/javascript">
 $(document).ready(function() {
 $.ajax({ 
 type: "GET", 
 url: "data1.xml", 
 dataType: "xml", 
 success:function(xml){ 

   $(xml).find('Root').each(function()
    {
      var title = $(this).find('title').text();
       var submit = $(this).find('submit').text();
      var subtitle = $(this).find('subtitle').text();
      var image = $(this).find('image').text();
      var inputType1=$(this).find('inputType1').text();
      var inputType2=$(this).find('inputType2').text();
      document.getElementById("yt1").value = title;
      document.getElementById("yt2").value = submit;
      document.getElementById("sub").innerHTML = subtitle;  
      document.getElementById("middle").src = image;
      document.getElementById("yt1").type = inputType1;
      document.getElementById("yt2").type = inputType2;
      });
    var data = "";

    var startTag = "<table  width='50%'CELLPADDING='1' CELLSPACING='1' id='example'><tbody>";
    var endTag = "</tbody></table>";
    $(xml).find('QA').each(function() {
        var $qa = $(this);
        var number =$qa.find('number').text();
        var inputType=$qa.find('inputType').text();
        var q = $qa.find('q').text();
        data += '<tr><td><h3>' + number + '</h3></td>';
        data +='<td><h3>'+ q +'</h3></td>';
        $(this).find('a').each(function() {
        data += '<tr><td>'+ inputType + '</td>';
        data += '<td>' + $(this).text()+ '</td></tr></tr>';

});
     });  
         $(xml).find('inputType').each(function() {
    $('input:checkbox').click(function() {
    $(this).siblings(':checked').attr('checked', false);   
    });

  }); 

    $("#content").html(startTag + data + endTag);
 }  }); });






  </script> 

0 个答案:

没有答案