<body>
<form name="Form1">
<input name="allbox" type="checkbox" onClick="TA();" title="选中或清除选中所有的项目" tabindex="105">选中或清除选中所有的项目
<br/>
<span class="X">
<input type="checkbox" name="ABC" class="A" onClick="TTA(this);">清明时节</span>
<br/>
<span class="X">
<input type="checkbox" name="DEF" class="A" onClick="TTA(this);">长江水啊</span>
<br/>
<span class="X">
<input type="checkbox" name="GHL" class="A" onClick="TTA(this);">嘿嘿测试</span>
<br/>
</form>
<script language="javascript">
var frm = document.Form1;
</script>
<script language="JavaScript">
function TA(isO,noHL){
var trk = 0;
for(var i=0;i<frm.elements.length;i++){
var e=frm.elements[i];
if((e.name !='allbox') && (e.type == 'checkbox')){
e.checked = frm.allbox.checked;
if (frm.allbox.checked){
//e.parentElement.className = "H"; //.parentElement不兼容firefox浏览器
e.parentNode.className = "H";//调用设置父节点元素class改变背景色
}else{
e.parentNode.className = "X";//调用设置父节点元素class改变背景色
}
}
}
}
function TTA(CB,noHL){
if (CB.checked){
CB.parentNode.className = "H";
}else{
CB.parentNode.className = "X";
}
var TB=TO=0;
for (var i=0;i<frm.elements.length;i++){
var e=frm.elements[i];
if ((e.name != 'allbox') && (e.type=='checkbox')){
TB++;
if (e.checked)
TO++;
}
}
frm.allbox.checked=(TO==TB)?true:false;
//如果不是所有项被选中则allbox设定未被选中
}
</script>
<style>
.H{
background: #ADD8E6
}
.X{
background: #FFFFFF
}
</style>
</body>
分享到:
相关推荐
"淘宝购物车全选js"这个话题主要涉及JavaScript技术在实现购物车全选功能中的应用。JavaScript是一种轻量级的解释型编程语言,常用于网页和网络应用的前端开发,可以实现实时的用户交互。 1. **全选按钮功能**: ...
HTML checkbox js全选 相信可以对您有用,js全选
在这个场景下,JavaScript(简称js)作为一种客户端脚本语言,可以很好地实现这种交互。本文将详细探讨如何通过JavaScript实现GridView的全选功能,并提供相关代码示例。 首先,我们需要了解JavaScript的基本语法和...
根据提供的文件信息,我们可以分析出该文件主要涉及的是JavaScript中实现对页面内所有复选框进行全选、反选及取消选择的功能。接下来,我们将详细解释这些功能的实现原理及代码逻辑。 ### 1. 全选功能实现 在文件...
JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选
通常,我们会使用`<input type="checkbox">`元素来表示每个可选项,并添加一个主控的全选按钮,通常是一个复选框,它的`id`为"全选",以便稍后通过JavaScript引用。 ```html 全选/取消全选 选项1 ...
在JavaScript(JS)中,全选效果是一种常见的用户交互功能,尤其在网页表格或列表中。这个功能允许用户通过单击一个按钮或链接来选择所有可选项目,或者取消已选中的所有项。这里我们将详细探讨如何使用JavaScript...
在JavaScript编程中,"全选反选"功能是常见的用户交互设计,常见于表格或列表数据的批量操作中。这个功能允许用户一键选择或取消选择所有项目,极大地提高了操作效率。下面将详细介绍如何使用JavaScript来实现这个...
通过上述介绍,我们可以看到,使用简单的JavaScript代码即可实现数据表格的全选和反选功能。这不仅提高了用户的操作效率,还提升了应用程序的整体体验。开发者可以根据实际需求调整代码逻辑,例如增加更多高级功能或...
js 全选反选取消, ASP.NET中url传递中文的解决方案, C#中使用反射显示程序集的所有类型和属性, js怎么取表格中的某一行的值, SQL Server 查询分析器快捷键集合, URLRewrite能够对URL进行重写,失败的原因
在JavaScript(JS)中,全选和单选是常见的用户交互功能,常见于表格、列表等数据展示场景。用户可能需要一键选择所有选项,或者独立选择单个元素。本篇文章将深入探讨如何实现这些功能,并结合提供的`test.html`...
在JavaScript(JS)中,"全选"和"清空"功能是常见于表单、列表等用户界面操作中的重要部分。这些功能允许用户快速选取或清除所有项目,提高交互体验。下面将详细介绍如何实现这样的功能,并提供相关知识点。 1. **...
在JavaScript编程中,全选和反选功能是常见的交互元素,尤其在表格或者多选列表中,用户往往希望一键选择或取消所有选项。本话题将深入探讨如何利用JavaScript实现这样的功能,以提升用户体验。 首先,我们需要理解...
### JavaScript 实现复选框全选/取消功能 在网页开发中,经常需要用到复选框全选或取消的功能。本文将详细介绍如何通过JavaScript实现这一功能,并解析提供的代码片段。 #### 1. 功能概述 本功能的目标是实现一个...
在网页开发中,JavaScript(简称JS)是一种必不可少的脚本语言,它被广泛用于实现页面上的交互性功能。本文将详细讲解如何利用JS实现“全选”checkbox按钮的功能,这在许多网页表单中非常常见,例如批量选择、批量...
JS JS实现全选反选 全选 反选
在这个HTML文件中,我们将看到SpreadJS的初始化代码,以及用于实现复选框全选功能的相关JavaScript逻辑。例如,我们需要引入 SpreadJS 的核心库,如 "gc.spread.sheets.all.14.1.1.min.js",这是一个包含了SpreadJS...
JavaScript(简称JS)是一种轻量级的解释型编程语言,广泛应用于网页和网络应用开发,特别是在客户端渲染的应用中。在网页交互中,全选效果是一个常见的功能,它允许用户一次性选择页面上的所有元素,比如表格数据、...
本文将详细解析如何利用JS控制选择框(通常为复选框)的全选与取消全选功能,以及在此基础上实现批量操作。 ### 核心知识点:JS控制选择框全选/取消全选 #### 1. HTML结构定义 在HTML文档中,选择框(复选框)由`...
自用 勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!