Checkbox 对象代表一个 HTML 表单中的 一个选择框。
在 HTML 文档中 <input type="checkbox"> 每出现一次，Checkbox 对象就会被创建。
您可以通过遍历表单的 elements[] 数组来访问某个选择框，或者通过使用 document.getElementById() 。
Checkbox 设置默认选中代码:
<input name="checkbox" type="checkbox" value="checkbox" checked="checked" />
注意：checked="checked"表示默认选中状态。
完整测javascript操作checkbox代码示例:
<script>
function add(){
var price = Number(document.getElementById("price1").value);
var boxes = document.getElementsByName("addPrice");
var num = boxes.length;
for(i=0;i<num;i++){
if(boxes[i].checked){
price += Number(boxes[i].value);
}
}
document.getElementById("price").innerHTML = "价格"+price+"元";
}
</script>
<div id="box">
<label><input type="checkbox" value="10" name="addPrice"
onclick="add()"/>增加10元</label>
<label><input type="checkbox" value="20" name="addPrice"
onclick="add()"/>增加20元</label>
<label><input type="checkbox" value="30" name="addPrice"
onclick="add()"/>增加30元</label>
</div>
<div id="price">价格48元</div>
<input type="hidden" id="price1" value="48" />
Html checkbox完整示例代码如下:
<html>
<head><title>选择</title></head>
<body>
请选择你喜欢的水果：<br>
<form action = "http://www.blabla.cn/asdocs/html_tutorials/choose.asp" method = "post">
<input type="checkbox" name="fruit" value ="apple" >苹果<br>
<input type="checkbox" name="fruit" value ="orange">桔子<br>
<input type="checkbox" name="fruit" value ="mango">芒果<br>
<input type="submit" value="提交">
</form>
</body>
</html>
