如何使用javascript实现，选中一个复选，才能选择该复选下面的几个下拉框，否则，下拉框禁用？

发布网友发布时间：2022-05-05 03:05

共4个回答

热心网友时间：2023-10-08 17:45

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<input type="checkbox" name="checkbox" onclick="checkFunc(this)" ><br>
<select id="select1" disabled="false">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>

<select id="select2" disabled="false">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

</BODY>
</HTML>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

热心网友时间：2023-10-08 17:46

<body>
<input name="a" type="checkbox" id="a" value="checkbox"> 辽宁

<input name="a1" type="checkbox" id="a1" value="checkbox" disabled>
沈阳
<input name="a1" type="checkbox" id="a1" value="checkbox" disabled>
大连
</body>
<script>
function ch()
{
var a=document.getElementById("a");
a.attachEvent("onclick",change_);
}
ch();
function change_()
{
var a=document.getElementById("a");
var fla=false;
if(a.checked)
fla=true;
else
fla=false;
var a1=document.getElementsByTagName("input");
for(var i=0;i<a1.length;i++)
{
if(a1[i].name=="a1")
{
if(fla)
a1[i].disabled=false;
else
a1[i].disabled=true;
}
}
}
</script>

热心网友时间：2023-10-08 17:46

在第一个复选框里写个事件不就完了，默认下面的下拉框是禁用的，在第一个复选框的事件里面修改下拉框的禁用状态
listeners:{
'check':function(checked){
if(checked.checked){
Ext.getCmp('row_begin').enable();
Ext.getCmp('row_end').enable();
Ext.getCmp('row_begin').setValue('startrow');
Ext.getCmp('row_end').setValue('rownum');
}else{
Ext.getCmp('row_begin').setValue(' ');
Ext.getCmp('row_end').setValue(' ');
Ext.getCmp('row_begin').disable();
Ext.getCmp('row_end').disable();
}
}
}
和这个类似吧，不过这里用的是ext的组件。

热心网友时间：2023-10-08 17:47

参与样例：
<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript" type="text/javascript">
function allowSelect(){
if(document.getElementById("checkbox").checked == true){
document.getElementById("select1").disabled = false;
}
else{
document.getElementById("select1").disabled = true;
}
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input name="checkbox" type="checkbox" onclick="allowSelect()" value="checkbox1" checked="checked" />
启用下拉列表框</label>
<br />
<label>下拉列表框
<select name="select1" id="select1">
<option value="值1">标签1</option>
<option value="值2">标签2</option>
</select>
</label>
</form>
</body>
</html>