<!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>
相关推荐
### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中,经常会使用到LayUI框架搭建网页应用,尤其是在设计复杂的数据展示界面时,LayUI提供了强大的数据表格功能。然而,在某些场景...
通常,密码输入框是用`<input type="password">`实现的,其特点是输入内容会以星号或圆点的形式显示,隐藏实际字符。但是,当Checkbox被选中时,我们可以让这些字符变为可见。以下是一个简单的JavaScript实现: ```...
如果多个CheckBox关联并触发同一事件,通常需要使用数组或集合来跟踪选中的项。例如,你可以创建一个数组,每当CheckBox状态变化时,将其ID或值添加到或从数组中移除。这样,可以知道哪些CheckBox被选中,进而执行...
在JavaScript编程中,实现Checkbox的...总的来说,JavaScript实现Checkbox的多级选择是一个涉及到DOM操作、事件处理、可能还有数据结构和算法的综合问题。理解并掌握这一技能,对于开发复杂的前端应用是非常重要的。
// obj.type 是触发类型,'all'或'one' // 取消其他已选中的复选框 table.eachData('testReload', function(i, item){ if(item.id !== obj.data.id && item.checkStatus){ table.checkStatus('testReload')....
2. JavaScript事件监听:使用`addEventListener`监听`change`事件,当全选`checkbox`被勾选或取消时触发相应的操作。 3. 全选逻辑:在事件处理函数中,遍历所有关联的`checkbox`,利用`checked`属性设置或清除它们的...
综上所述,实现 `checkbox` 的多项选中及取消选中,需要理解 `checkbox` 的基本用法,掌握JavaScript操作DOM属性的方法,理解 `attr` 与 `prop` 的区别,并灵活运用事件监听和样式控制。通过这些技术,你可以创建出...
在ASP.NET Web Forms开发中,CheckBoxList控件是一种常用的选择组件,它允许用户从一系列选项中选择一个或多个项目。本篇文章将详细讲解如何进行CheckBoxList的操作,包括获取选中项、实现全选、取消选中以及反选...
这可以通过再次触发全选Checkbox的`CheckedChanged`事件,但这次改变所有行Checkbox的状态为未选中。 4. **事件处理和逻辑** 在代码-behind文件中(例如.CS文件),我们需要定义`CheckedChanged`事件的处理函数。...
Checkbox 点击事件触发 Span 元素内容改变的方法 Checkbox 点击事件触发 Span 元素内容改变的方法是一种常见的交互方式,在网页开发中非常常用。今天,我们将为大家带来一个使用 Checkbox 点击事件触发 Span 元素...
2. **JavaScript交互**:通过JavaScript监听主`checkbox`的`change`事件。当该事件触发时,遍历所有子`checkbox`,并根据主`checkbox`的状态来改变它们的`checked`属性。 ```javascript document.getElementById('...
同时,JavaScript还可以监听Checkbox的状态变化,触发相应的事件处理函数,如更新页面的其他部分,或者发送数据到服务器。 总结来说,“CheckBox的优化.rar”项目提供了如何使用前端技术优化Checkbox的实例。它不仅...
开发者可以利用各种前端框架或库(如React、Vue、Angular等)实现Checkbox Tree,例如在JavaScript中,有一些专门的库,如`dtree`(可能对应压缩包中的文件),提供了便捷的API和丰富的定制选项,帮助开发者快速构建...
本文将深入探讨如何在Struts框架下处理checkbox的数组传值,以及如何利用JavaScript增强用户体验。 ### Struts框架中的Checkbox处理 #### 1. **Struts标签库** Struts是Java Web应用开发的一个流行框架,提供了...
`toggleButton`是触发下拉显示的按钮ID,`slideToggle`函数提供了平滑的展开和折叠动画。 6. **处理用户选择** 在服务器端,可以使用`CheckBoxList`的`Items`集合来访问用户的选定项。例如,获取所有选中项的值:...
Checkbox是一种允许用户选择或取消选择一个或多个选项的交互控件。它的状态有两种:选中(checked)和未选中(unchecked)。我们可以通过设置`checked`属性来默认选中一个checkbox。 其次,`<button>`元素是网页中...
7. **JavaScript/jQuery交互**:由于ASP.NET服务器控件在客户端与服务器端交互时会自动生成复杂的ID,所以可能需要使用JavaScript或jQuery来处理客户端的事件和操作,例如在客户端隐藏和显示CheckBoxList。...
在这个例子中,`this`关键字在事件处理函数内部指代触发事件的元素,即我们的复选框。这样,每当用户更改复选框状态时,都会输出相应的消息。 在实际开发中,可能有多个复选框,这时我们可以使用类选择器或者数据...
// 事件处理函数,当Checkbox状态改变时触发 function checkboxChanged(event:Event):void { var checkbox:CheckBox = event.target as CheckBox; trace("Checkbox with label '" + checkbox.label + "' is now " ...
本文将详细解读如何使用Jquery为单选框checkbox绑定单击click事件,并在事件触发时执行相应的函数。 首先,我们需要了解HTML中单选框checkbox的定义。单选框是表单元素中的一个类型,它允许用户在一组选项中选择一...