HTMLcheckbox的使⽤（取值、赋值、判断是否选中）【复习】
这⾥只说⼀些经常⽤到的元素属性和checkbox相关的⽅法。
1、⾸先是HTML：（checkbox的声明）
<input type=""name=""value=""disabled="none"checked="checked"/>
声明⼀个checkbox主要是⽤到上⾯⼏个属性：
type：代表input的类型，值为checkbox则代表是多选框。
name：设置返回checkbox的名称，也就是说要想我们选中的选项能⼀起通过form提交，则必须声明为name相同。
value：设置或返回checkbox的value属性的值，我们在提交form表单的时候value代表我们选中的那个checkbox的值。
checked：设置或返回checkbox是否被选中。
disabled：设置或返回checkbox是否应被禁⽤。
上⾯是⼀些关于checkbox常⽤的属性说明，下⾯我们来举⼀个例⼦：
<input type="checkbox"name="ball"value="basketball"checked="checked"/>篮球
<input type="checkbox"name="ball"value="football"/>⾜球
<input type="checkbox"name="ball"value="volleyball"/>排球
<input type="checkbox"name="ball"value="badminton"/>乒乓球
上⾯我们声明了⼀个name为ball的多选框，其中第⼀个value为basketball则如果我们选中，则提交的时候就会将该value值提交到服务器，我们设置第⼀个checkbox为checked，则默认选中第⼀项。
2、通过点击⽂字，来实现点击响应的checkbox：（两种⽅式）
第⼀种：直接在每个input中声明⼀个id，然后后⾯的⽂字⽤lable标签包起来，并使⽤for属性指向input中的id实现绑定。
jquery是什么有什么作用<form name="ballForm"id="formId">
<input type="checkbox"name="ball"value="basketball"id="1"checked="checked"/><label for="1">篮
球</label>
<input type="checkbox"name="ball"value="football"id="2"/><label for="2">⾜球</label>
<input type="checkbox"name="ball"value="volleyball"id="3"/><label for="3">排球</label>
<input type="checkbox"name="ball"value="badminton"id="4"/><label for="4">乒乓球</label>
</form>
第⼆种：直接使⽤lable标签将input和⽂本⼀起嵌套起来（简单粗暴）。
<label><input name="ball"type="checkbox"value="basketball"checked="checked"/>篮球</label>
<label><input name="ball"type="checkbox"value="football"/>⾜球</label>
<label><input name="ball"type="checkbox"value="volleyball"/>排球</label>
<label><input name="ball"type="checkbox"value="badminton"/>乒乓球</label>
3、如何获取checkbox选中的值：（也是两种）
第⼀种：使⽤JQuery获取：
1）我们获取单个checkbox选中的值：
var checks =$("input[name = 'ball']:checked").val();
2）获取多个checkbox选中的值：
function jqueryFun(){
var arr =[];//声明⼀个数组⽤来存放遍历出来的checkbox value值
$("input[name='ball']:checked").each(function(i){//遍历
arr.push($(this).val());//将我们遍历出来的值push到数组中
//最后可以提交arr就可以实现将我们选中的checkbox的value值提交
})
}
第⼆种：使⽤JavaScript来获取：
function test(){
// 获取所有的复选框元素
var obj1 = document.ballForm.ball;
var arr =[];
for(i =0; i< obj1.length; i++){
if(obj1[i].checked){
arr.push(obj1[i].value);
}
}
}
/
/最后将我们获取到的arr提交就可以了
注意：jQuery对象取值时：jqueryObj.val()；dom对象取值时： domObj.value；
4、判断某个checked是否被选中：（三种⽅法）
在JQuery1.6版本之后，取消复选框有没有选中，我们都是使⽤prop⽅法：
⽅法⼀：
if($("#checkbox-id").get(0).checked){
// do something
}
if($("#checkbox-id")[0].checked){
// do something
}
⽅法⼆：
if($('#checkbox-id').is(':checked')){
// do something
}
⽅法三：
if($('#checkbox-id').prop('checked')){
// do something
}
5、设置复选框是否为选中的代码：
$("input[name='ball']").prop("checked",true/false);
$("input[name='ball']").prop("checked",$("#1").prop('checked'));
6、额外：获取选择 radio 的值：
$("input:radio[name='']:checked").val();
你要去做⼀个⼤⼈，不要回头，不要难过。
“我还是很喜欢你，像⾬洒落在热带与极地，不远万⾥。”

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。