`
wc_stone
  • 浏览: 57398 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

全选 反选 取消 js函数

阅读更多
触发方法:

    1.按钮(button)
    
     <input type="button" value="全选" onclick="checkboxAll(document.fromName)"/>
     


    2.复选框(checkbox)
    
     <input type="checkbox" name="all" value="checkboxAll" onclick="selectOther()"/>反选
     

     注:方法名和name名不可相同

    3.超链接(a) 
    
     A.<a href="#" onclick="SelectAll()">全选</a>
     B.<a href="javascript:selectClear(document.fromName)">取消</a>
     




方法体:

    1.全选
    
function SelectAll() {
	var obj=document.getElementById("userList");
	for(var i=0 ;i<obj.elements.length;i++){ 
        if(obj.elements[i].type.toLowerCase()=="checkbox"){ 
            e=obj.elements[i]; 
            e.checked=true; 
        } 
    }     
}
     


    2.取消
    
function selectClear(obj) {  
	for(var i=0 ;i<obj.elements.length;i++){ 
        if(obj.elements[i].type.toLowerCase()=="checkbox"){ 
            e=obj.elements[i]; 
            e.checked= false; 
        } 
    }
}
     


    3. 反选
    
function selectOther(obj) {
	for(var i = 0; i < obj.elements.length; i++)
		if(obj.elements[i].type.toLowerCase() == "checkbox") {
			if(!obj.elements[i].checked)
				obj.elements[i].checked = true;
			else
				obj.elements[i].checked = false;
		}   
}
     
分享到:
评论

相关推荐

    Javascript实现全选反选

    在JavaScript编程中,"全选反选"功能是常见的用户交互设计,常见于表格或列表数据的批量操作中。这个功能允许用户一键选择或取消选择所有项目,极大地提高了操作效率。下面将详细介绍如何使用JavaScript来实现这个...

    js checkbox全选 反选 取消全部设置表单checkbox复选框勾选

    本篇文章将详细讲解如何利用JavaScript实现`checkbox`的全选、反选和取消全部功能,以及相关的代码示例。 ### 1. `checkbox`基本概念 `checkbox`在HTML中通过`&lt;input type="checkbox"&gt;`标签创建。默认情况下,`...

    jquery全选反选插件

    本话题将深入探讨“jQuery全选反选插件”的相关知识点,这对于构建具有复选框全选和反选功能的用户界面非常有用。 首先,jQuery全选反选插件的核心功能是实现复选框的批量选择。在网页上,当用户需要对一组选项进行...

    JS简单表格列表全选反选代码.zip

    总的来说,"JS简单表格列表全选反选代码.zip"提供的源码可以帮助开发者理解如何利用JavaScript实现表格的全选和反选功能,这对于前端开发人员来说是一项基础但至关重要的技能。通过学习和实践这个代码,你可以加深对...

    jquery全选反选全不选案例

    "jquery全选反选全不选案例" 是一个常见的交互功能,常见于表格或者列表中,允许用户一键选择或取消所有选项。这个功能在数据筛选、批量操作等场景下非常实用。 实现这一功能的关键在于理解 jQuery 中的选择器和...

    简单js实现全选全部选反选效果

    在JavaScript编程中,全选和反选功能是常见的交互元素,尤其在表格或者多选列表中,用户往往希望一键选择或取消所有选项。本话题将深入探讨如何利用JavaScript实现这样的功能,以提升用户体验。 首先,我们需要理解...

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

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

    checkbox全选反选与批量删除附源码

    4. **事件绑定**:为了响应用户的操作,我们需要将`selectAll`和`unselectAll`函数绑定到全选和反选的复选框上,通常使用`addEventListener`方法。 ```javascript var allCheckbox = document.getElementById('...

    js checkbox全选 反选 取消全部设置表单html复选框勾选

    在网页开发中,JavaScript(简称JS...总之,通过JavaScript,我们可以轻松地实现HTML表单中复选框的全选、反选和取消全部勾选功能,从而提高用户界面的互动性和实用性。了解并掌握这些基本技巧是前端开发中的重要一环。

    全选反选复选框JS实现

    - `全选反选_按钮.js`这个文件很可能包含了实现这些功能的JS代码。通常,它会包含上述逻辑的函数定义,以及在页面加载完成后绑定事件监听器的代码。 - 例如,可能会有像`selectAll()`、`unselectAll()`和`check...

    原生JS表格列表全选反选代码.zip

    这个"原生JS表格列表全选反选代码"就是一个解决此类问题的示例。下面将详细介绍这个示例中涉及的关键知识点。 1. **HTML表格(`&lt;table&gt;`)**: HTML表格是网页中用于组织数据的基本元素,由`&lt;table&gt;`、`&lt;tr&gt;`(行...

    多选框全选反选

    根据提供的描述:“多选框全选和反选,用js做的,多选框单选和反选,和使用的代码”,我们可以明确以下几点: 1. **目标**:通过JavaScript代码实现对一组复选框进行全选和全不选的操作。 2. **功能需求**: - ...

    jQuery全选反选及批量删除

    "jQuery全选反选及批量删除"是一个常见的交互功能,常用于表格或列表的管理,例如用户可以选择多个项目进行批量操作,如删除。这里我们将深入探讨如何实现这个功能。 首先,我们需要了解jQuery的选择器和事件绑定。...

    JS全选反选父项子项联动多选框

    ### JS全选反选父项子项联动多选框知识点详解 #### 一、知识点概述 在前端开发中,我们经常遇到需要实现全选/反选功能的需求,尤其是在表格或列表选择场景中。本文将详细介绍一种实现“父项选中时,子项随父项选中...

    js 全选/反选/删除选择等代码 (精华)

    在JavaScript编程中,全选、反选和删除选择等功能是网页交互中常见且重要的操作,尤其是在数据表或者多选项列表中。这些功能可以极大地提升用户体验,使得用户能够快速地进行批量操作。以下是对这些概念的详细说明:...

    带复选框的多级目录树,复选框的选择控制子节点父节点 全选和反选

    在IT领域,尤其是在前端开发中,构建用户界面时经常需要处理多级目录树结构,并且在这样的结构中加入复选框功能,以便用户可以进行批量选择或者全选、反选操作。这种技术常用于文件管理器、权限设置、菜单配置等场景...

    jQuery表格行全选反选单选代码.zip

    综上所述,jQuery表格行全选反选单选代码是通过tableCheckbox.js插件实现的,提供了高效和直观的用户交互体验,特别是对于处理大量数据的表格。同时,这个话题也涉及到了jQuery在实现选项卡等界面特效方面的应用,...

    extjs带复选框的树包括全选 反选 子选父以及 父选子

    - `extjs复选框树.js`:这是实现上述功能的JavaScript代码,包括工具类和针对树节点的操作方法。 - `样式文件.css`:可能包含了一些自定义的样式,用于美化复选框和树的显示效果。 - `示例HTML文件.html`:演示如何...

    复选框全选反选取消

    在网页交互设计中,"复选框全选反选取消"功能是常见的一种用户操作,尤其在处理大量数据选择时非常实用。这个功能允许用户通过一个主复选框(通常称为全选框)来一次性选中或取消所有子复选框,也可以单独选择或取消...

Global site tag (gtag.js) - Google Analytics