在 javascript 中存储选中的复选框值
Store checked checkbox value in javascript
MY 每个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>
您可以尝试的一件事是将其存储为 JSON 对象。例如,假设div1、div2 和div3 各包含 2 个复选框。然后 JSON 对象将仅包含选中的复选框,例如
var jsonObject = [{ "divName" : "div1", "selectedCheckBoxes" : [{"checkbox1"}] }, [{ "divName" : "div2", "selectedCheckBoxes" : [{"checkbox2"}] }]
等等。
此链接将帮助您了解 JSON 对象。
演示:
$(function() {
$('#myButton').click(function() {
$('input:checkbox:checked').each(function(i) {
alert(this.value);
var id= $(this).parent().attr('id')
alert(id);
});
});
});
一种方法是使用 JSON 存储。它有一个称为 checked 的事件,该事件返回一个布尔值。另外,请通过以下链接:http://docs.sencha.com/ext-js/3-4/#!/api/Ext.form.Checkbox-event-check
相关文章:
- 使用Angular存储用户以前是否选中过复选框,然后再调用它的最佳方式是什么
- 在本地存储中选中复选框,但在加载时也要筛选列表
- 使用angular中的本地存储来存储选中的复选框
- 存储动态创建的复选框值
- 如何使用复选框启用选项并通过本地存储进行保存
- 如何将复选框呈现为从本地存储数据中选中的复选框
- 在表单提交中获取复选框值,并使用jQuery将其存储在变量中
- 如何保留输入复选框值的存储数组
- 复选框选中 持久化与 Angular js 中的本地存储
- 如何记住复选框是选中还是取消选中(单击时)使用本地存储并保存值
- 使用会话存储复选框的状态
- 如何使用 Javascript 或 jQuery 将输入类型复选框存储到 json 对象中
- HTML - 在本地存储复选框值并检索
- 使用本地存储维护复选框的选中状态
- 在 javascript 中存储选中的复选框值
- jquery复选框值的基本存储
- 在复选框中存储表单操作URL'的值,并且使用该URL发出AJAX请求会导致无法解释的失败
- 本地存储,用于保存页面上的每个输入和复选框值
- 选中所有复选框并将选定复选框的名称存储在会话中.PHP、Javascript
- 根据选中的复选框存储数组元素