我已经使用 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>