<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
< script type="text/JavaScript">
function onbutton(){
//document.getElementById("checkbox1").checked = false;
alert(document.getElementById("checkbox1").checked);
}
< /script>
< body>
< form method="get">
<p><input type="checkbox" name="vehicle" value="Bike" /> I have a bike</p>
<p><input type="checkbox" name="vehicle" id="checkbox1" value="Car" checked=""/> I have a car</p>
<input type="button" value="点击" onclick="return onbutton()" /><br/>
</form>
< /body>
< /html>
代码中 <input type="checkbox name=vehicle" id="checkbox1" value="Car checked=""/>i hava a car
只要出现了checked="",不管等于什么,可以等于checked="checked",甚至checked="false",其checkbox的属性checked都是true,在alert中输出其checked属性都是true.
如果在上述代码的onbutton()函数中把document.getElementById("checkbox1").checked = false;的注释去掉,则checkbox未被选中,注意这里false不能用引号括起来。
对于value属性,复选框的 value 属性值不会显示在用户界面中。value 属性用于表单数据的提交(只有选中的复选框才会传递数据到服务端,如果什么都没选则不传递复选框数据)。实际中有个例子:要实现一个表示子产品独立标志的复选框,checkbox的value=1,表示选中,0:不选中
本来是这么写的
function changeSub_fund_flag(){
if(document.theform.sub_fund_flag.checked){
document.theform.sub_fund_flag.value = 1; //theform为checkbox所在的表单
}else{
document.theform.holidays_delay_flag1.value = 0;
}
}
<td align="right">子产品资金独立标志:</td>
<td>
<input <%=display_select%> type="checkbox" <%if(sub_fund_flag== 1) out.print("checked");%> onkeydown="javascript:nextKeyPress(this)"
name="sub_fund_flag" class="flatcheckbox" onclick="return changeSub_fund_flag()">
</td>
点击复选框,根据onclick事件处理,将value值设为1或0.这样提交表单的时候value值会被提交上去。
其实这有点多此一举,因为只要选中的复选框的数据才会提交。修改如下:
<td align="right">子产品资金独立标志:</td>
<td>
<input <%=display_select%> type="checkbox" value="1" <%if(sub_fund_flag== 1) out.print("checked");%> onkeydown="javascript:nextKeyPress(this)"
name="sub_fund_flag" class="flatcheckbox">
</td>
这样checkbox被选中时,它的value=1也被提交。如果没被选中,则value值不提交,即为null.