Checkbox触发隐藏或显示 javascript checkbox事件【转】
?
?
?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>javascript判断单选框或复选框是否选中方法,checkbox javascript 事件</title>
<style type=text/css>
<!--
BODY{
margin:0px;
FONT-SIZE: 12px;
FONT-FAMILY: "宋体", "Verdana", "Arial", "Helvetica", "sans-serif";
background-color: #ffffff;/*#BEBFD9;*/
scrollbar-face-color: #EAEAF2;
??????? scrollbar-highlight-color: #FFFFFF;
??????? scrollbar-shadow-color: #9395C0;
??????? scrollbar-3dlight-color: #F3F3F8;
??????? scrollbar-arrow-color: #9395C0;
??????? scrollbar-track-color: #F3F3F8;
??????? scrollbar-darkshadow-color: #F3F3F8;
}
table { border:0px; }
td { font:normal 12px 宋体; }
img { vertical-align:bottom; border:0px; }
a { font:normal 12px 宋体; color:#111111; text-decoration:none; }
a:hover { color:#6C70AA;text-decoration:underline; }
.sec_menu { border-left:1px solid white; border-right:1px solid white; border-bottom:1px solid white; overflow:hidden; background:#FBFBFC; }
.menu_title { }
.menu_title span { position:relative; top:2px; left:8px; color:#4A4F80; font-weight:bold; }
.menu_title2 { }
.menu_title2 span { position:relative; top:2px; left:8px; color:#596099; font-weight:bold; }
input,select,Textarea{
font-family:宋体,Verdana, Arial, Helvetica, sans-serif; font-size: 12px;}
.admin_tab_title { background: #8486B7; color:#FFFFFF; padding:5px;}
-->
</style>
</head>
<body><br>
提示:getEmementsByName方法的作用是根据 NAME 标签属性的值获取对象的集合。<br>
<br>
<table width='770' border='0' align='center' cellpadding='0' cellspacing='1' class='tablecolor'>
<tr class='banner'>
??? <td height='55' align='center' ><strong>管理管理员</strong></td>
</tr>
</table>
<table width='770' border='0' align='center' cellpadding='3' cellspacing='1' class='tablecolor'>
<form name='form1' method='post' action='?action=saveedit'>
??? <tr class='tablebody'>
????? <td width='200' height='25' align='center' bgcolor='#8486B7' style='color:#ffffff; height:35'>管理员账号</td>
????? <td bgcolor='#E3E3E3'><input name='adminname' type='text' id='adminname' value='' maxlength='20'></td>
??? </tr>
??? <tr class='tablebody'>
????? <td height='25' align='center' bgcolor='#8486B7' style='color:#ffffff; height:35'>管理员密码</td>
????? <td bgcolor='#E3E3E3'><input name='adminpwd' type='password' value='' maxlength='20'>
至少5位</td>
??? </tr>
??? <tbody id='tr1' style='display:block;'>
????? <tr class='tablebody'>
??????? <td height='25' align='center' bgcolor='#8486B7' style='color:#ffffff; height:35'>管理员权限</td>
??????? <td bgcolor='#E3E3E3'><input name='G0' type='checkbox' value=1>
常规设置
????????? <input name='G1' type='checkbox' value=1>
企业信息设置
????????? <input name='G2' type='checkbox' value=1>
新闻与公告设置
????????? <input name='G3' type='checkbox' value=1>
产品与服务设置
<br>
????????? <input name='G5' type='checkbox' value=1>
附加信息设置
????????? <input name='G6' type='checkbox' value=1>
国际原油价格设置
????????? <input name='G7' type='checkbox' value=1>
成品油价格设置
????????? <input name='G8' type='checkbox' value=1>
首页动画设置 </td>
????? </tr>
??? </tbody>
??? <tbody id='tr2' style='display:block;'>
????? <tr class='tablebody'>
??????? <td height='25' align='center' bgcolor='#8486B7' style='color:#ffffff; height:35'>产品与服务类别</td>
??????? <td bgcolor='#E3E3E3'><input name='H0' type='checkbox' value=15>
产品
????????? <input name='H1' type='checkbox' value=16>
加油站安全常识
????????? <input name='H2' type='checkbox' value=17>
服务
????????? <input name='H3' type='checkbox' value=19>
商业客户中心
????????? <input name='H4' type='checkbox' value=20>
仓储中心 </td>
????? </tr>
??? </tbody>
??? <tr class='tablebody'>
????? <td height='25' align='center' bgcolor='#8486B7' style='color:#ffffff; height:35'>超级管理员选项</td>
????? <td bgcolor='#E3E3E3'><input name='IsSuper' type='checkbox' value=1 onClick='javascript:fnTr();'>
<font color=red>超级管理员</font></td>
??? </tr>
??? <tr class='tablebody'>
????? <td height='45' align='center' > </td>
????? <td><input type='hidden' name='id' value=''>
??????? <input type='submit' name='Submit' value='提 交'>
??????? <input type='reset' name='Submit2' value='重 置'></td>
??? </tr>
</form>
</table>
<script language="javascript">
function fnTr(){
if (document.getElementsByName('IsSuper')[0].checked==true){
?? document.getElementById('tr1').style.display = "none";
?? document.getElementById('tr2').style.display = "none";
}else{
?? document.getElementById('tr1').style.display = "block";
?? document.getElementById('tr2').style.display = "block";
}
}
fnTr();
</script>
</body>
</html>
|
|
?
