`
fuyun369
  • 浏览: 31280 次
  • 性别: Icon_minigender_1
  • 来自: 江苏
社区版块
存档分类
最新评论

javascript实现全选/全不选/反选

阅读更多
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
<script type="text/javascript">
function dosubmit(name,id)
{
  var names=document.getElementById(id);
  if(names.checked==true){
  checkedAll(name)
  }
else{
checkedNo(name)
}
}

//全选
function checkedAll(name)
{
  var names=document.getElementsByName(name);
  var len=names.length;
  if(len>0)
  {
   var i=0;
   for(i=0;i<len;i++)
   names[i].checked=true;
   
  }
}
//全不选
function checkedNo(name)
{
var names=document.getElementsByName(name);
var len=names.length;
if(len>0)
  {
    var i=0;
    for(i=0;i<len;i++)
    names[i].checked=false;
  }
}
//反选
function reserveCheck(name)
{
  var names=document.getElementsByName(name);
var len=names.length;
if(len>0)
{
var i=0;
   for(i=0;i<len;i++)
   {
     if(names[i].checked)
     names[i].checked=false;
     else
     names[i].checked=true;
   }
}
}

</script>

  <head>
    <title>全选/全不选/反选</title>
  </head>
<body>
 
<form id="form2" action="" name="buyForm" method="post">
<input id="checkQuan" type="checkbox" onclick="dosubmit('fuyun','checkQuan')"/>全选/全不选
<input id="checkFan" type="checkbox" onclick="reserveCheck('fuyun','checkQuan')"/>反选<br>
<input name="fuyun" type="checkbox" value="fuyun1"/>1<br>
<input name="fuyun" type="checkbox" value="fuyun2"/>2<br>
<input name="fuyun" type="checkbox" value="fuyun3"/>3<br>
<input name="fuyun" type="checkbox" value="fuyun4"/>4<br>
</form>
</body>
</html>
分享到:
评论

相关推荐

    Javascript实现全选反选

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

    简单的JAVASCRIPT全选/反选

    在上述代码中,`this.checked`代表主复选框的当前状态,将其赋值给每个子复选框,实现了全选/全不选。 反选功能则需要将所有子复选框的选中状态与主复选框的当前状态相反。这可以通过遍历子复选框并切换它们的`...

    javaScript实复选框的全选,全不选,反选

    javaScript入门案例之复选框全选,全不选,反选

    jquery全选反选全不选案例

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

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

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

    jquery 实现全选,全不选,反选,获取选中的值

    综上所述,使用 jQuery 实现全选、全不选、反选以及获取选中值的功能是相当直观和简单的。通过绑定事件处理器,我们可以轻松地响应用户的交互,动态地更新页面状态。结合 HTML 结构和适当的 CSS 样式,可以创建出...

    js全选/反选

    在本话题中,我们将深入探讨如何使用JavaScript实现全选和反选的功能。 一、全选功能 全选功能通常通过一个复选框(checkbox)触发,当用户点击这个复选框时,所有的子项(其他复选框)都会被自动选中。以下是一个...

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

    总结来说,全选、反选和删除选择是JavaScript中常见的交互功能,通过遍历和操作DOM中的元素,可以实现这些功能,提升用户的操作效率。在实际开发中,这些功能通常结合HTML和CSS一起使用,以提供完整的用户界面和交互...

    juqery实现复选框全选/反选demo源码

    在标题"jQuery实现复选框全选/反选demo源码"中,我们关注的核心知识点是利用jQuery实现复选框的全选和反选功能。这个功能在许多网页应用中都非常实用,比如在表格数据筛选、表单多选等场景。通过简单的jQuery代码,...

    简单实现全选反选功能(html)

    在网页开发中,全选和反选功能是常见的交互元素,尤其在表格或者多选项列表中,用户可能希望一键选择所有项目或清除已选。在这个案例中,我们将探讨如何使用HTML和jQuery来实现这一功能。 首先,我们需要创建HTML...

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

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

    JS实现全选、反选

    JS JS实现全选反选 全选 反选

    jquery全选/全不选/反选另一种实现方法(配合原生js)

    接下来,我们需要监听用户对“全选/不选”和“反选”按钮的操作。这可以通过jQuery的`$(document).ready()`函数来实现,当文档加载完成时执行其中的代码: ```javascript $(document).ready(function(){ // ... })...

    jquery Checkbox 全选 反选 全不选 多种实现方法

    在涉及到表单元素如复选框(Checkbox)时,经常需要实现全选、反选和全不选的功能。下面将详细探讨 jQuery 如何实现这些功能,以及如何进行表单验证。 1. **全选功能** 要实现全选功能,首先我们需要一个主复选框...

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

    以上就是使用JavaScript实现全选和反选功能的基本方法。在实际应用中,可能还需要考虑更多细节,如处理异步加载的数据、兼容不同浏览器等。通过不断学习和实践,你可以熟练掌握这些技巧,提高网页的交互性和用户体验...

    复选框的应用(全选、反选、全不选效果)

    复选框的应用(全选、反选、全不选效果)

    Js/Jquery 实现checkbox全选,反选,全不选

    本文将详细讲解如何通过JS和jQuery实现checkbox的全选、反选以及全不选功能。 首先,我们需要理解HTML中的复选框元素`&lt;input type="checkbox"&gt;`,它允许用户在一组选项中进行多选。为了实现全选、反选和全不选的...

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

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

    三种方式实现checkbox全选,反选

    以下是三种实现Checkbox全选和反选的方法,以及它们的JavaScript和Java实现细节。 ### 方法一:使用`checked`属性 **JavaScript实现**: 在JavaScript中,可以通过获取全选按钮的`checked`属性来控制所有复选框的...

    checkbox实现全选和反选经典例子

    在高级控件如DataGridView中,通过结合Checkbox可以实现全选和反选功能,为用户提供便捷的操作方式。这个经典例子将深入探讨如何在Web应用中实现这一功能。 1. **Checkbox基本概念** Checkbox是HTML中的一个表单...

Global site tag (gtag.js) - Google Analytics