`
dayaolili
  • 浏览: 2450 次
  • 性别: Icon_minigender_2
  • 来自: 黑龙江
社区版块
存档分类
最新评论

JavaScript全选(全消),动态全选全消(转)

阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">   
<HTML>   
<HEAD>   
<TITLE>JavaScript全选(全消),动态全选全消</TITLE>   
<script type="text/javascript" language="javascript">  
function checkAll()//此方法用来全选和全消复选框  
{  
var items=document.getElementsByName("checkC");  
var itemall=document.getElementById("all");  
for(var i=0;i<items.length;i++){  
items[i].checked=itemall.checked;  
}  
}  
function resAll(){  
var items=document.getElementsByName("checkC");  
var itemall=document.getElementById("all");  
var ite=0; //此变量用来记录当前选中的checkbox的个数  
for(var i=0;i<items.length;i++){  
//获得当前选中的checkbox的数量  
if(items[i].checked){  
ite++;  
}  
}  
//如果当前选中的数量为有一个没有选中,并且全选框是选中状态  
//则将全选框的状态变为不选择  
if(ite==items.length-1&&itemall.checked){  
itemall.checked=false;  
}
  /*---  
//这个适用于你想把子选项完全去掉才将全选的效果去掉  
if(ite==0&&itemall.checked){  
itemall.checked=false;  
}  
---*/  
//如果当前选中的数量为零并且全选框是未选中状态  
//则将全选框的状态变为选择  
if(ite==items.length&&!itemall.checked){  
itemall.checked=true;  
}  
}  
</script>  
</HEAD>   
<BODY>   
此脚本适合由数据库动态创建时使用这样的,因为里面不需要传递参数。因此扩展性不是很高<br/>   
<input type="checkbox" name="all" id="all" onclick="checkAll()">全选   
<input type="checkbox" name="checkC" onclick="resAll()">1   

<input type="checkbox" name="checkC" onclick="resAll()">2   
 
<input type="checkbox" name="checkC" onclick="resAll()">3   

<input type="checkbox" name="checkC" onclick="resAll()">4   

<input type="checkbox" name="checkC" onclick="resAll()">5   

<input type="checkbox" name="checkC" onclick="resAll()">6   
 
<input type="checkbox" name="checkC" onclick="resAll()">7   
 
</BODY>   
</HTML>
分享到:
评论

相关推荐

    全选全消+日期显示+动态标题

    全选全消+日期显示+动态标题 ,简单的小例子,非常实用,都是js实现的

    角色全选全消

    在“角色全选全消”的实现中,JavaScript可以监听用户对主选择框(通常是全选按钮)的操作,然后根据用户的勾选状态,遍历并更新所有子角色的选择状态。 下面我们将深入探讨这个功能的实现细节: 1. **事件监听**...

    JavaScript 全选全不选

    JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选

    js实现权限树的更新权限时的全选全消功能

    在JavaScript中,实现权限树的全选全消功能通常涉及到对树形结构数据的操作,特别是当这些节点关联有复选框时。权限树通常用于管理用户或角色的访问权限,每个节点代表一个权限项,全选意味着赋予所有权限,全消则...

    Javascript实现全选反选

    - 处理动态加载的子复选框:如果子复选框是动态生成的,可以使用`MutationObserver`来监听DOM的变化,确保新添加的复选框也能正确响应全选/反选。 - 多个全选/反选组:如果有多个全选/反选组,可以使用不同的类名或...

    简单的JAVASCRIPT全选/反选

    在JavaScript编程中,全选和反选功能是常见的交互操作,尤其在网页表格或列表中。这个主题涉及到了DOM操作、事件处理以及数组方法。下面将详细解释如何使用JavaScript实现全选和反选功能。 首先,我们需要理解...

    js全选js全选js全选js全选

    自用 勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!勿下!!

    javascript实现全选全不选

    在JavaScript编程中,“全选”和“全不选”功能是常见的用户...3. 监听子项复选框的`change`事件,动态更新全选复选框的状态。 这样的功能不仅提高了用户界面的交互性,还简化了用户的操作,是网页开发中的常见实践。

    JavaScript全选和反选

    &lt;script language=javascript&gt; function checkAll(boolvalue){ var items=document.getElementsByTagName("input"); for(i=0;i;i++){ if(items[i].type=="checkbox"){ items[i].checked=boolvalue; } } } ...

    C# datagridview 中使用checkbox 全选、全消,以及窗体变大时控件位置随之变化

    综上所述,通过以上步骤,我们可以在C#的DataGridView中实现复选框的全选、全消功能,并确保窗体大小调整时控件位置的正确适应。同时,注意代码的结构和性能优化,能够提升用户体验并降低资源消耗。

    javascript全选

    ### JavaScript全选功能详解 #### 一、引言 在Web开发中,表格或列表中的数据经常需要进行批量操作,例如批量删除、批量修改状态等。此时,全选功能便显得尤为重要。它不仅可以提高用户体验,还能简化前端逻辑,...

    javascript复选框全选

    javascript 复选框全选,复选框全选,复选框全选

    JavaScript全选效果

    JavaScript全选效果是网页交互中常见的一种功能,它允许用户通过单击一个按钮或复选框来选择页面上的所有可选元素,如表格中的行或列表项。在HTML文件中实现这种效果通常需要结合JavaScript(一种广泛用于网页动态...

    javascript全选反选

    9. **AJAX与异步操作**:如果数据是从服务器动态加载的,你可能需要结合AJAX请求来获取或更新复选框的数据,并在数据加载完成后进行全选或反选。 10. **无障碍性(Accessibility)**:在实现这些功能时,不要忘记...

    javascript 实现复选框全选/取消功能

    ### JavaScript 实现复选框全选/取消功能 在网页开发中,经常需要用到复选框全选或取消的功能。本文将详细介绍如何通过JavaScript实现这一功能,并解析提供的代码片段。 #### 1. 功能概述 本功能的目标是实现一个...

    javaScript全选

    javaScript实现复选框全选功能!

    教你一天玩转JavaScript(七)——使用JavaScript完成复选框的全选和全不选的效果

    在JavaScript的世界里,复选框(checkbox)是网页交互中常见的元素,用户可以通过它们来选择一个或多个选项。本教程将深入讲解如何使用JavaScript实现复...希望这个教程能帮助你在一天内玩转JavaScript的这个实用特性。

    javascript 实现 TreeView全选(实现子节点全选,中父节点自动全选)

    javascript 实现 TreeView全选(实现子节点全选,中父节点自动全选)

    js实现全选效果

    在JavaScript(JS)中,全选效果是一种常见的用户交互功能,尤其在网页表格或列表中。这个功能允许用户通过单击一个按钮或链接来选择所有可选项目,或者取消已选中的所有项。这里我们将详细探讨如何使用JavaScript...

Global site tag (gtag.js) - Google Analytics