不用JS框架的前提下，我觉得最简单的写法是：
以前写反选的时候都用if来判断，今天尝试了下这样写，发现也是对的。O(∩_∩)O~
<script type="text/javascript">
var ids = document.getElementsByName("id");
function select(){
for(var i=0;i<ids.length;i++)
ids[i].checked = true;
}
function inverse(){
for(var i=0;i<ids.length;i++)
ids[i].checked = !ids[i].checked;
}
</script>
测试运行代码：
<html>
<head>
<title>全选/反选--测试胡伟官方网[http://jshuwei.org.cn]提供</title>
<style type="text/css">
.no{
list-style:none;
}
</style>
</head>
<body>
<ul>
<li class="no"><input type="checkbox" name="id" value="1"/></li>
<li class="no"><input type="checkbox" name="id" value="2"/></li>
<li class="no"><input type="checkbox" name="id" value="3"/></li>
<li class="no"><input type="checkbox" name="id" value="4"/></li>
<li class="no"><input type="checkbox" name="id" value="5"/></li>
<li class="no"><input type="checkbox" name="id" value="6"/></li>
</ul>
<script type="text/javascript">
var ids = document.getElementsByName("id");
function select(){
for(var i=0;i<ids.length;i++)
ids[i].checked = true;
}
function inverse(){
for(var i=0;i<ids.length;i++)
ids[i].checked = !ids[i].checked;
}
</script>
<a href="#" onclick="select();">全选</a> <a href="#" onclick="inverse();">反选</a>
</body>
</html>
分享到：
相关推荐
以上就是Flex中DataGrid内嵌CheckBox实现全选反选及防止选择状态错乱的基本步骤。通过自定义列类、监听CheckBox事件和处理全选/全反逻辑，我们可以创建一个功能完善的多选DataGrid。在实际项目中，还可以根据需求...
4. **`demo.html`的实现**：在`demo.html`文件中，应该包含了一个简单的HTML结构，例如一个主复选框（全选按钮）和多个子复选框。jQuery脚本部分将实现上述的全选、反选和取消选择的功能。你可以打开这个文件，查看...
购物车全选反选功能是电商网站中常见的需求，允许用户一次性选择或取消选择所有商品。 首先，我们需要创建一个HTML模板，该模板包含一个表格来展示购物车中的商品，以及用于全选和反选的复选框。在这个例子中，我们...
在本文中，我们将深入探讨如何使用Silverlight技术来实现数据网格(DataGrid)的全选、反选、分页以及导出到Excel的功能。Silverlight是一种由微软开发的富客户端技术，用于创建丰富的交互式Web应用程序。 ### ...
全选和反选功能通常用于批量操作这些选项。在本文中，我们将深入探讨如何使用JavaScript (JS)、HTML 和 CSS 实现复选框的全选与反选功能。 首先，我们来看HTML部分。在这个例子中，我们创建了一个表格（Table），...
在jQuery库的帮助下，这个任务变得非常简单和直观，正如标题“Jquery CheckBox全选方法代码附js checkbox全选反选代码”所示。这里我们将详细讲解如何使用jQuery实现全选和反选的功能，并对比JavaScript的实现方式。...
虽然此段代码提供了一个简单的全选/反选实现，但在实际应用中可能需要根据具体需求进行调整和优化。 最后，虽然jQuery库可以大大简化JavaScript的开发，但近年来随着Web标准的不断提升和原生JavaScript功能的增强，...
本文深入浅出地讲解了如何使用jQuery实现复选框（Checkbox）的全选、全不选和反选功能。这是前端开发中经常遇到的一个需求，特别是在需要批量操作多选框时非常有用。通过具体的实例，本文为读者提供了一套简单易行的...
如示例中提到的“全选”、“全不选”、“反选”和“获得选中的所有值”按钮，每种按钮对应一个操作，利用jQuery来实现这些操作是简单直接的。 全选按钮（"selectAll"）在被点击时，将循环遍历所有的子复选框，并把...
这里，我们简单地将其他复选框的选中状态取反，实现反选功能。 最后，要获取选中的复选框的值，可以遍历所有复选框并收集已选中的项： ```javascript function getCheckedValues() { var checkedValues = []; ...
在本文中，我们将深入探讨如何使用jQuery实现复选...总的来说，这个3分钟编写的jQuery全选/反选功能提供了一个快速实现该功能的示例，适用于简单的应用场景。然而，对于复杂的项目，可能需要进行更多的优化和错误处理。
本文档主要介绍了使用JavaScript实现简单全选和反选功能的方法和代码实现。全选功能是指在有多个复选框（checkbox）的情况下，通过点击一个按钮使得所有的复选框都被选中；反选功能则是在所有复选框已经选中或未选中...
在这个"JavaScript例子—实现行的增加、删除、全选、反选"的主题中，我们将探讨如何利用JavaScript实现表格数据的操作，这些操作在许多Web应用程序中都非常常见，如数据管理、表格编辑等。 首先，全选和反选功能...
在网页交互设计中，全选和反选功能是常见的用户操作需求，特别是在处理多选列表时。JavaScript 是实现这类功能的理想选择，因为它可以实时更新页面元素的状态，无需刷新页面。本篇文章将详细介绍如何使用 JavaScript...
jQuery实现复选框全选、取消全选、反选及...通过上述的讲解，我们可以看到，利用jQuery对复选框进行全选、取消全选、反选及获得选择的值的操作相对简单，只要熟练掌握jQuery选择器和遍历方法，就可以轻松实现这些功能。
总之，Vue.js通过其强大的数据绑定和响应式机制，使得实现全选/反选功能变得简单且直观。这个示例展示了如何利用Vue的特性构建一个交互式的用户界面，并提供了学习Vue.js基本用法的一个实例。希望这个例子能帮助你更...
在本文中，我们将深入探讨如何使用jQuery实现全选和反选功能，这通常在具有复选框列表的网页中非常有用。例如，在一个表格中，用户可能需要一次性选择或取消选择所有行。以下是一个简单的示例，展示了如何通过jQuery...
而为了提升用户体验，经常需要通过编程来实现一些快捷的操作，例如全选、全不选和反选复选框。jQuery作为一个快速、小巧且功能丰富的JavaScript库，使得这些操作的实现变得非常简单。 在这篇文章中，将介绍如何使用...
使用jQuery可以方便地控制这些多选框的行为，比如实现全选与反选的功能。本文将介绍如何利用jQuery的prop()函数来实现对多选框的全选和反选控制。 首先，了解jQuery中的prop()函数是十分重要的。prop()函数用于获取...
通过上述介绍，我们可以看到，使用简单的JavaScript代码即可实现数据表格的全选和反选功能。这不仅提高了用户的操作效率，还提升了应用程序的整体体验。开发者可以根据实际需求调整代码逻辑，例如增加更多高级功能或...