[dreamweaver] 中怎么样定义单选框和复选框?
2个回答
2013-07-15
展开全部
网页复选框的效果实现(图)
[编辑本段]
(一)如何实现复选框的全选和反选
解决思路:
全选的实现:遍历所有复选框,然后设置各多选项的checked属性为true。反选的实现:遍历所有复选框,获取复选框的checked属性值,是true的话则设置为false,否则设为true,即作当前值的相反设置。
具体步骤:
代码示例:
<script>
function selectit(){
//设置变量form的值为name等于select的表单
var form=document.select
//取得触发事件的按钮的name属性值
var action=event.srcElement.name
for (var i=0;i<form.elements.length;i++){//遍历表单项
//将当前表单项form.elements对象简写为e
var e = form.elements
//如果当前表单项的name属性值为iTo,
//执行下一行代码。限定脚本处理的表单项范围。
if (e.name == "iTo")
/*如果单击事件发生在name为selectall的按钮上,就将当前表单项的checked属性设为true(即选中),否则设置为当前设置的相反值(反选)*/
e.checked =(action=="selectall")?(form.selectall.checked):(!e.checked)
}
}
</script>
<form name="select">
<INPUT type="checkbox" name="selectall" onclick="selectit()">全选
<INPUT type="checkbox" name="Inverse" onclick="selectit()">反选
<INPUT type="checkbox" name="iTo" value="1">1
<INPUT type="checkbox" name="iTo" value="2">2
<INPUT type="checkbox" name="iTo" value="3">3
<INPUT type="checkbox" name="iTo" value="4">4
<INPUT type="checkbox" name="iTo" value="5">5
</form>
注意:本例中能被全选或反选的复选框必须设置name为iTo。
技巧:在本例中其实不用遍历表单的每个元素,只需要遍历getElementsByName("iTo")集合就行了。
特别提示
代码运行后,选中”全选”复选框,所有name为iTo的复选框将被选中,效果如图1.4.12所示。
图1.4.12 全选复选框
特别说明
本例需要掌握的内容是对表单项的遍历和复选框的选中或不选中状态的设置或获取。
checked 设置或获取复选框或单选钮的状态,true 为选中,false为不选中。
elements 获取以源顺序排列的指定表单中所有控件的集合(不包括图像类型的控件对象)。
[编辑本段]
(一)如何实现复选框的全选和反选
解决思路:
全选的实现:遍历所有复选框,然后设置各多选项的checked属性为true。反选的实现:遍历所有复选框,获取复选框的checked属性值,是true的话则设置为false,否则设为true,即作当前值的相反设置。
具体步骤:
代码示例:
<script>
function selectit(){
//设置变量form的值为name等于select的表单
var form=document.select
//取得触发事件的按钮的name属性值
var action=event.srcElement.name
for (var i=0;i<form.elements.length;i++){//遍历表单项
//将当前表单项form.elements对象简写为e
var e = form.elements
//如果当前表单项的name属性值为iTo,
//执行下一行代码。限定脚本处理的表单项范围。
if (e.name == "iTo")
/*如果单击事件发生在name为selectall的按钮上,就将当前表单项的checked属性设为true(即选中),否则设置为当前设置的相反值(反选)*/
e.checked =(action=="selectall")?(form.selectall.checked):(!e.checked)
}
}
</script>
<form name="select">
<INPUT type="checkbox" name="selectall" onclick="selectit()">全选
<INPUT type="checkbox" name="Inverse" onclick="selectit()">反选
<INPUT type="checkbox" name="iTo" value="1">1
<INPUT type="checkbox" name="iTo" value="2">2
<INPUT type="checkbox" name="iTo" value="3">3
<INPUT type="checkbox" name="iTo" value="4">4
<INPUT type="checkbox" name="iTo" value="5">5
</form>
注意:本例中能被全选或反选的复选框必须设置name为iTo。
技巧:在本例中其实不用遍历表单的每个元素,只需要遍历getElementsByName("iTo")集合就行了。
特别提示
代码运行后,选中”全选”复选框,所有name为iTo的复选框将被选中,效果如图1.4.12所示。
图1.4.12 全选复选框
特别说明
本例需要掌握的内容是对表单项的遍历和复选框的选中或不选中状态的设置或获取。
checked 设置或获取复选框或单选钮的状态,true 为选中,false为不选中。
elements 获取以源顺序排列的指定表单中所有控件的集合(不包括图像类型的控件对象)。
2013-07-15
展开全部
直接写代码不就好了
单选的是
<input type="radio" name="s" value="0" checked="checked">
复选的是
<input type="checkbox" name="c" value="1" checked="checked">
单选的是
<input type="radio" name="s" value="0" checked="checked">
复选的是
<input type="checkbox" name="c" value="1" checked="checked">
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询