<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>Insert title here</title>
<script type="text/javascript">
function selAll(obj) {
var items = document.getElementsByTagName("input");
for(var i=0; i<items.length; i++) {
if(items[i].type == "checkbox" && items[i].name == "checkSel") {
items[i].checked = obj.checked;
}
}
}
function funCheck() {
var flag = true;
var items = document.getElementsByTagName("input");
for(var i=0; i<items.length; i++) {
if(items[i].name == "checkSel") {
if(!items[i].checked) {
flag = false;
break;
}
}
}
document.getElementById("cbSelectAll").checked = flag;
}
</script>
</head>
<body>
<table border="1" align="center" style="margin-top: 80px; width:50%">
<tr>
<th align="left" width="10%">
<input type="checkbox" id='cbSelectAll' onclick="selAll(this);">
</th>
<th>标题</th>
</tr>
<tr>
<td>
<input type="checkbox" name='checkSel' onclick="funCheck()">
</td>
<td>1</td>
</tr>
<tr>
<td>
<input type="checkbox" name='checkSel' onclick="funCheck()">
</td>
<td>2</td>
</tr>
<tr>
<td>
<input type="checkbox" name='checkSel' onclick="funCheck()">
</td>
<td>3</td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
### jQuery与纯JavaScript实现全选功能的区别 在前端开发领域，选择使用jQuery库还是原生JavaScript来实现某些功能，如全选功能，始终是一个值得讨论的话题。本文将深入探讨使用这两种方式实现全选功能的不同之处，...
二、JavaScript实现全选功能 在JavaScript中，我们可以通过事件监听和DOM操作来实现全选功能。下面是一个简单的实现： ```javascript document.getElementById('selectAll').addEventListener('change', function()...
总结一下，JavaScript实现全选全不选的核心思路是： 1. 创建一个全选/全不选的主复选框，并绑定`onclick`事件。 2. 编写函数处理全选/全不选的逻辑，改变所有子项复选框的状态。 3. 监听子项复选框的`change`事件，...
在JavaScript中，全选和反选...总的来说，通过JavaScript实现全选和反选功能并不复杂，关键在于正确地获取和操作复选框的`checked`属性。了解这些基础知识后，你可以灵活地应用在各种Web项目中，提高用户的交互体验。
这里我们将详细探讨如何使用JavaScript实现全选和取消全选的效果。 首先，我们需要了解HTML结构。在网页中，我们通常会有一个复选框作为全选控制元素，以及一组相关的复选框或单选按钮代表可选项目。以下是一个简单...
在JavaScript编程中，"全选反选"功能是常见的用户交互...以上就是使用JavaScript实现全选/反选功能及其相关的事件绑定的详细解析。这个功能在实际开发中非常常见，理解并掌握这一机制对于提升用户体验具有重要意义。
为了实现全选功能，我们需要添加一个额外的选项，其值可以是一个特殊值，表示“全选”。同时，我们需要监听`@change`事件，当选择或取消“全选”时，更新所有其他选项的状态。这可以通过遍历`options`数组并改变每个...
以上就是使用JavaScript实现全选和反选功能的基本方法。在实际应用中，可能还需要考虑更多细节，如处理异步加载的数据、兼容不同浏览器等。通过不断学习和实践，你可以熟练掌握这些技巧，提高网页的交互性和用户体验...
在网页开发中，"js实现全选删除+jsp"是一个常见的功能需求，它涉及到JavaScript（js）和JavaServer Pages（jsp）的交互，主要用于提高用户体验，让用户能够方便地选择并删除多个项目。以下是对这个主题的详细解释： ...
在本文中，我们将深入探讨如何使用JavaScript和jQuery来实现全选功能，并且会详细解析全选、反选以及单个选择等操作的具体实现方法。同时，我们也会对比这两种技术实现方式的不同之处及其适用场景。 ### 一、...
很好用的使用jquery来实现的通用的全选反选功能
相比之下，原生JavaScript实现全选功能则需要更多的DOM操作。例如，`getElementsByClassName()`用于获取具有特定类名的所有元素，然后通过`for`循环遍历这些元素，使用`setAttribute()`和`removeAttribute()`来改变`...
在这个HTML文件中，我们将看到SpreadJS的初始化代码，以及用于实现复选框全选功能的相关JavaScript逻辑。例如，我们需要引入 SpreadJS 的核心库，如 "gc.spread.sheets.all.14.1.1.min.js"，这是一个包含了SpreadJS...
本文将详细介绍如何通过JavaScript实现这一功能，并解析提供的代码片段。 #### 1. 功能概述 本功能的目标是实现一个简单的全选/取消全选功能。当用户点击一个特定的复选框时（此例中的 `checkbox2`），页面上的...
1. 使用JavaScript操作DOM，实现全选/取消全选功能。 2. 使用数据结构（如JavaScript对象或数组）存储各分页的选中状态。 3. 在分页切换时，根据存储的数据恢复和更新选中状态。 通过这些步骤，我们可以创建一个...
本教程将深入探讨如何使用jQuery实现全选和反选功能，这在多选列表或表格中非常常见，例如在批量处理数据时。 全选和反选功能的核心在于同步用户界面中的复选框状态。当用户点击一个主复选框（通常标记为“全选”）...
主要适用于全选和反选 共两个按钮一个全选和反选 全选可以实现点击全选后全部被（选中） 再点击全选的时候 就被（取消）了。 当然反选就不用说了 此代码功能很实用·····
自用 勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！勿下！！
同时，为了实现全选/取消全选功能，可以在其他事件处理函数中，例如在列表项的点击事件中，加入逻辑来同步 `select_all` 的状态。 最后，示例中的“效果图”部分通常会展示实际运行时用户看到的界面，帮助开发者...
通过学习和理解这些代码，开发者可以掌握如何在实际项目中实现树结构的复选框多选全选功能。 总之，理解和实现"树结构 复选框 多选 全选功能"是提升前端开发技能的重要一环。它要求开发者具备数据结构知识、事件...