`
Franciswmf
  • 浏览: 796938 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

js--复选框--全选、反选、取消

 
阅读更多

----------------------------------------------------------
//第一种方法:存在不足之处
//全选、反选、取消
//全选
function selectAll() {
for (i = 0; i < document.form.missiveType.length; i++) {
if (!document.form.missiveType[i].checked) {
document.form.missiveType[i].checked = true;
}
}
}
//反选
function selectRerverse() {
for (i = 0; i < document.form.missiveType.length; i++) {
if (document.form.missiveType[i].checked) {
document.form.missiveType[i].checked = false;
} else {
document.form.missiveType[i].checked = true;
}
}
}

//取消
function cancelAll() {
for (i = 0; i < document.form.missiveType.length; i++) {
if (document.form.missiveType[i].checked) {
document.form.missiveType[i].checked = false;
}
}
}
---------------------------------------------------
第二种方法:较好
//全选、反选、取消
//全选
function selectAll() {
var es=document.getElementsByName("missiveType");
for (i = 0; i < es.length; i++) {
if (!es[i].checked) {
es[i].checked = true;
}
}
}
//反选
function selectRerverse() {
var es=document.getElementsByName("missiveType");
for (i = 0; i < es.length; i++) {
if (es[i].checked) {
es[i].checked = false;
} else {
es[i].checked = true;
}
}
}

//取消
function cancelAll() {
var es=document.getElementsByName("missiveType");
for (i = 0; i < es.length; i++) {
if (es[i].checked) {
es[i].checked = false;
}
}
}
分享到:
评论

相关推荐

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

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

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

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

    实现table表格checkbox复选框的全选 反选

    在网页开发中,表格(Table)是常用的数据...总的来说,实现HTML表格中复选框的全选与反选功能主要依赖于JavaScript和CSS(用于样式),这是一项基础但重要的交互设计。理解并掌握这个功能,有助于提升网页的用户体验。

    vue+vant-UI框架实现购物车的复选框全选和反选功能

    其中,复选框全选和反选功能可以帮助用户快速选择或取消选择购物车中的全部商品。本文档将会介绍如何使用Vue.js结合Vant-UI组件库来实现这一功能。 #### 2. Vant-UI和Vue.js简介 **Vue.js** 是一个构建用户界面的渐...

    全选反选复选框JS实现

    全选功能允许用户一次性选择所有列出的选项,反选则可以取消所有已选中的选项,而复选框则是用户逐项选择或取消选择的交互控件。以下将详细介绍如何使用JavaScript来实现这些功能。 1. **全选功能**: - 在HTML中...

    spreadjs_列头添加复选框全选功能-demo.zip

    《SpreadJS:实现列头复选框全选功能详解》 SpreadJS 是一款强大的JavaScript电子表格库,由 GrapeCity 公司开发,它允许开发者在Web应用中创建、编辑和展示电子表格数据。在实际应用中,我们经常需要在列头添加复...

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

    "js checkbox全选 反选 取消全部设置表单html复选框"这个标题描述了一个常见的功能需求,即通过JavaScript控制HTML中的复选框(checkboxes),实现全选、反选和取消全部选中的功能。在本文中,我们将深入探讨如何...

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

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

    多选框全选反选

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

    Javascript实现全选反选

    全选反选的核心思想是通过更改一个主复选框的状态(通常被称为“全选”按钮)来同步所有子复选框的状态。当“全选”按钮被选中时,所有子复选框应被选中;反之,如果“全选”按钮被取消选中,所有子复选框则应被取消...

    jquery 、js实现复选框 (全选、反选)

    #### 二、原生JavaScript实现复选框全选与反选 除了使用jQuery外,还可以使用原生JavaScript来实现相同的功能。 **2.1 全选功能** ```javascript // 全选 function chooseAll() { var selects = document....

    复选框的全选和反选、复选框的全选和反选

    反选功能与全选类似,但它的目的是取消所有已选中的复选框。以下是一个反选的JavaScript示例: ```javascript function deselectAll() { var checkboxes = document.getElementsByName('checkboxName'); for (var...

    复选框全选、全不选和反选的效果实现.rar

    本资源"复选框全选、全不选和反选的效果实现.rar"聚焦于JavaScript(JS)实现复选框的全选、全不选和反选功能,这对于创建交互性强、用户体验良好的网页表单至关重要。全选、全不选和反选功能使得用户可以便捷地管理...

    checkbox使用jquery全选-反选-取得选中的值-Housl.zip

    `$("input[type='checkbox']")`则选择了所有的复选框,`.not(this)`排除了主复选框本身,`.prop("checked", this.checked)`用于设置或获取属性值,如果主复选框被选中,则所有子复选框也会被选中,反之则取消选中。...

    JQ 复选框全选反选

    "JQ 复选框全选反选"是jQuery应用中的一个常见功能,主要用于增强用户界面的交互性。在网页中,复选框常常用于让用户多选选项,而全选和反选功能则提供了方便快捷的选择所有或取消所有选项的方式。 首先,我们需要...

    jquery全选反选全不选案例

    此外,为了提供反选(即取消所有选中项)的功能,我们可以在点击 "全选" 复选框时,检查它当前是否已被选中。如果已经被选中,那么反选所有的子复选框: ```javascript $(document).ready(function() { $("#select...

    基于jQuery的三个JS复选框全选反选例子.zip

    总之,这个"基于jQuery的三个JS复选框全选反选例子"旨在帮助开发者理解和实现复选框全选反选的前端功能,这在网页表单、用户设置等场景中十分实用。通过学习和实践这些示例,开发者可以提升自己的jQuery技能,更好地...

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

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

    jquery特效制作复选框,全选,反选,取消,购物车,统计价格,统计

    在这个项目中,我们关注的是使用jQuery来实现一些特定的功能,这些功能包括复选框的操作(全选、反选、取消选择)以及购物车中的商品价格统计。 首先,让我们深入了解一下复选框的操作。在HTML中,复选框是通过`...

    jQuery实现复选框checkbox全选、反选功能.rar

    本示例中,我们关注的是如何使用jQuery来实现复选框(checkbox)的全选和反选功能,这对于构建具有交互性的表单或者需要用户进行多选操作的界面是非常实用的。 在HTML中,复选框通常由`&lt;input&gt;`标签定义,类型为...

Global site tag (gtag.js) - Google Analytics