对于这个复选框,我们需要时刻获取它的值,并且去修改它的
js 实现 选中复选框 文字变色的方法,涉及 javascript 鼠标事件及页面元素的相关操作技巧。
CheckBox复选框JS实现全选全不选功能,很简单,就只需插入一小段js函数就行了。。。<script
language="javascript">
function
cli(Obj)
{
//获取控制其它复选框的对象obj
var
collid
=
document.getElementByIdx_x("all")
//获取需要全选,全不选功能的所有复选框
var
coll
=
document.getElementsByName(Obj)
//如果obj被选中,则全选
if
(collid.checked){
//循环设置所有复选框为选中状态
for(var
i
=
0
i
<
coll.length
i++)
coll[i].checked
=
true
}else{//取消obj选中状态,则全不选
//循环设置所有复选框为未选中状态
for(var
i
=
0
i
<
coll.length
i++)
coll[i].checked
=
false
}
}
</script>
----------------------------------------------------
下面是一组CheckBox复选框html代码
----------------------------------------------------
<input
name='多选项名称'
type='checkbox'
value=''
id="all"
onclick="cli('多选项名称')">
全选
<input
name='多选项名称'
type='checkbox'
value=''
>
A
<input
name='多选项名称'
type='checkbox'
value=''
>
B
<input
name='多选项名称'
type='checkbox'
value=''
>
C
<input
name='多选项名称'
type='checkbox'
value=''
>
D
<input
name='多选项名称'
type='checkbox'
value=''
>
E
<input
name='多选项名称'
type='checkbox'
value=''
>
F
----------------------------------------------------
本文实例讲述了js使用DOM设置单选按钮、复选框及下拉菜单的方法。分享给大家供大家参考。具体实现方法如下:1.设置单选按钮
单选按钮在表单中即<input
type="radio"
/>它是一组供用户选择的对象,但每次只能选一个。每一个都有checked属性,当一项选择为ture时,其它的都变为false.
先贴上一个例子:
复制代码
代码如下:<script
type="text/javascript">
function
getChoice()
{
var
oForm
=
document.forms["uForm1"]
var
aChoices
=
oForm.camera
for
(i
=
0
i
<
aChoices.length
i++)
//遍历整个单选项表
if
(aChoices[i].checked)
//如果发现了被选中项则退出
break
alert("相机品牌是:"
+
aChoices[i].value)
}
function
setChoice(iNum)
{
var
oForm
=
document.forms["uForm1"]
oForm.camera[iNum].checked
=
true
}
</script>
<form
method="post"
name="uForm1"
action="addInfo.aspx">
相机品牌:
<p>
<input
type="radio"
name="camera"
id="canon"
value="Canon">
<label
for="canon">Canon</label>
</p>
<p>
<input
type="radio"
name="camera"
id="nikon"
value="Nikon">
<label
for="nikon">Nikon</label>
</p>
<p>
<input
type="radio"
name="camera"
id="sony"
value="Sony"
checked>
<label
for="sony">Sony</label>
</p>
<p>
<input
type="radio"
name="camera"
id="olympus"
value="Olympus">
<label
for="olympus">Olympus</label>
</p>
<p>
<input
type="radio"
name="camera"
id="samsung"
value="Samsung">
<label
for="samsung">Samsung</label>
</p>
<p>
<input
type="radio"
name="camera"
id="pentax"
value="Pentax">
<label
for="pentax">Pentax</label>
</p>
<p>
<input
type="radio"
name="camera"
id="others"
value="其它">
<label
for="others">others</label>
</p>
<p>
<input
type="submit"
name="btnSubmit"
id="btnSubmit"
value="Submit"
class="btn">
</p>
<p>
<input
type="button"
value="检测选中对象"
onclick="getChoice()">
<input
type="button"
value="设置为Canon"
onclick="setChoice(0)">
</p>
</form>