我的每个div包含多个复选框,我有几个div。我想跟踪选中哪个复选框及其各自的div。我试图将它存储在一个多维数组中,但它不合适.. 如果您有任何其他想法,那么请与我分享。
<html>
<head>
<style type="text/css" >
div{
width:50%;
height:500px;
border:2px solid black;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
var count = 0;
function selectradiobutn(frmname){
formfield=document.forms[frmname].first_ques;
for(i=0;i<formfield.length;i++){
if(formfield[i].checked==true){
var value1 = formfield[i].value;
alert(value1);
var value = new Array;
value[i]=value1;
var myarray = new Array("A. Aluminium","B. Commodities that is available according to their demand","C. to remove salts","D. 1970 in Bangkok","D. None of the above");
if(myarray[i]==value[i]){
count++;
//alert(count);
}
}
}
return count;
}
function create_array1(){
alert("Your score is"+count);
document.getElementById('main').innerHTML = "Your score is"+count;
}
</script>
</head>
<body>
<div id="main" style="width:50%; height:500px; border:2px solid black;">
<center><p style="padding:70px;"><h1>Click the button to start test</h1></p>
<input type="button" value="Start test." id="btn_start" onclick="show_div('main','first1')">
</div>
</center>
<div id="first1" style="display:none; ">
<p style="padding:50px;">1. For galvanizing iron which of the following metals is used ?
</br>
<form name="f1">
<input type=Checkbox name=first_ques value="A. Aluminium" onclick="selectradiobutn('f1')">A. Aluminium </br></br>
<input type=Checkbox name=first_ques value="B. Copper" onclick="selectradiobutn('f1')">B. Copper</br></br>
<input type=Checkbox name=first_ques value="C. Lead" onclick="selectradiobutn('f1')">C. Lead</br></br>
<input type=Checkbox name=first_ques value="D. Zinc" onclick="selectradiobutn('f1')">D. Zinc</br></p>
<center><input type="button" value="Next" onclick="show_div('first1','first2')"></center>
<div id="first2" style="display:none;">
<p style="padding:50px;"> 2. Economic goods are </br>
<form name=f2>
<input type="Checkbox" name=first_ques value="first" onclick="selectradiobutn('f2')">A. all commodities that are limited in quantity as compared to their demand</br></br>
<input type="Checkbox" name=first_ques value="B. Commodities that is available according to their demand" onclick="selectradiobutn('f2')">B. Commodities that is available according to their demand</br></br>
<input type="Checkbox" name=first_ques value="C. Commodities that is available more as compared to demand" onclick="selectradiobutn('f2')">C. Commodities that is available more as compared to demand</br></br>
<input type="Checkbox" name=first_ques value="D. None of the above" onclick="selectradiobutn('f2')">D. None of the above</br></br></p>
<center><input type="button" value="Next" onclick="show_div('first2','first3')"></center>
<div id="first3" style="display:none;">
<p style="padding:50px;">3. For purifying drinking water alum is used
<form name="f3">
<input type="Checkbox" value="A. for coagulation of mud particles" name=first_ques onclick="selectradiobutn('f3')">A. for coagulation of mud particles</br> </br>
<input type="Checkbox" value="B. to kill bacteria" name=first_ques onclick="selectradiobutn('f3')">B. to kill bacteria</br></br>
<input type="Checkbox" value="C. to remove salts" name=first_ques onclick="selectradiobutn('f3')">C. to remove salts</br></br>
<input type="Checkbox" value="D. to remove gases" name=first_ques onclick="selectradiobutn('f3')">D. to remove gases</br></br></p>
<center><input type="button" value="Next" onclick="show_div('first3','first4')"></center>
</form>
</div>
<div id="first4" style="display:none;">
<p style="padding:50px;">4. Hockey was introduced in the Asian Games in
<form name="f4">
<input type="Checkbox" value="A. 1958 in Tokyo" name=first_ques value="first_forth" onclick="selectradiobutn('f4')">A. 1958 in Tokyo</br></br>
<input type="Checkbox" value="B. 1962 in Jakarta" name=first_ques onclick="selectradiobutn('f4')">B. 1962 in Jakarta</br></br>
<input type="Checkbox" value="B. 1962 in Jakarta" name=first_ques onclick="selectradiobutn('f4')">B. 1962 in Jakarta</br></br>
<input type="Checkbox" value="D. 1970 in Bangkok" name=first_ques onclick="selectradiobutn('f4')">D. 1970 in Bangkok</br></br></p>
<center><input type="button" value="Next" onclick="show_div('first4','first5')"></center>
</form>
</div>
<div id="first5" style="display:none;">
<p style="padding:50px;">5.ESCAP stands for
<form name="f5">
<input type="Checkbox" value="A. Economic and Social Commission for Asia and Pacific" name=first_ques onclick="selectradiobutn('f5')">A. Economic and Social Commission for Asia and Pacific</br></br>
<input type="Checkbox" value="B. European Society Council for Africa and Pacific" name=first_ques onclick="selectradiobutn('f5')">B. European Society Council for Africa and Pacific</br></br>
<input type="Checkbox" value="C. Economic and Social Commission for Africa and Pacific" name=first_ques onclick="selectradiobutn('f5')">C. Economic and Social Commission for Africa and Pacific</br></br>
<input type="Checkbox" value="D. None of the above" name=first_ques onclick="selectradiobutn('f5')">D. None of the above</br></br></p>
答案 0 :(得分:1)
您可以尝试的一件事是将其存储为JSON对象。例如,假设div1,div2和div3各包含2个复选框。然后JSON对象将只包含已选中的复选框,如
var jsonObject = [{ "divName" : "div1", "selectedCheckBoxes" : [{"checkbox1"}] }, [{ "divName" : "div2", "selectedCheckBoxes" : [{"checkbox2"}] }]
等等。
这个link可以帮助您理解JSON对象。
答案 1 :(得分:0)
<强> DEMO 强>:
$(function() {
$('#myButton').click(function() {
$('input:checkbox:checked').each(function(i) {
alert(this.value);
var id= $(this).parent().attr('id')
alert(id);
});
});
});
答案 2 :(得分:0)
一种方法是使用JSON存储。它有一个名为checked的事件,它返回一个布尔值。另外,请通过以下链接: http://docs.sencha.com/ext-js/3-4/#!/api/Ext.form.Checkbox-event-check