<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" language="javascript">
function selectAllDels()
{
var allCheckBoxs = document.getElementsByName("preDelCheck");
var desc = document.getElementById("allChecked");
var selectOrUnselect=false;
for(var i = 0; i < allCheckBoxs.length; i ++ )
{
if(allCheckBoxs[i].checked){
selectOrUnselect=true;
break;
}
}
if (selectOrUnselect)
{
_allUnchecked(allCheckBoxs);
}else
{
_allchecked(allCheckBoxs);
}
}
function _allchecked(allCheckBoxs){
for(var i = 0; i < allCheckBoxs.length; i ++ )
{
allCheckBoxs[i].checked = true;
}
}
function _allUnchecked(allCheckBoxs){
for(var i = 0; i < allCheckBoxs.length; i ++ )
{
allCheckBoxs[i].checked = false;
}
}
</script>
</head>
<body>
<p>test</p>
<form>
<input type="checkbox" name="preDelCheck" value="cream">ID1<br>
<input type="checkbox" name="preDelCheck" value="sugar" >ID2<br>
<input type="checkbox" name="preDelCheck" value="sugar">ID3<br>
<input type="checkbox" name="preDelCheck" value="sugar">ID4<br>
<input type="checkbox" name="preDelCheck" value="sugar">ID5<br>
<input type="button" id="allChecked" value="全选/取消全选" onClick="selectAllDels()">
</form>
</body>
</html>
分享到：
相关推荐
### JavaScript 实现复选框全选/取消功能 在网页开发中，经常需要用到复选框全选或取消的功能。本文将详细介绍如何通过JavaScript实现这一功能，并解析提供的代码片段。 #### 1. 功能概述 本功能的目标是实现一个...
在全选/反选的场景中，我们通常会用到`document.querySelectorAll()`或`document.getElementById()`来获取HTML元素，比如复选框。 全选功能通常是通过一个主复选框触发所有子复选框的状态更改。以下是一个基本的...
在这篇关于HTML中JavaScript实现全选/取消全选操作的示例代码中，我们可以学到以下几个重要的知识点： 1. HTML页面中复选框（checkbox）的使用：在HTML表单中，复选框是通过`<input type="checkbox">`标签来创建的...
此外，为了实现全选/取消全选的功能，可以在`el-select`组件上添加一个`@change`事件监听器，当选择项发生变化时触发`toggleAllChecked`方法： ```html v-model="value" multiple placeholder="请选择" @...
"checkbox全选/取消全选以及checkbox遍历...首先，我们在HTML中创建一个CheckBox组，并添加一个全选/取消全选的CheckBox： ```html <input type="checkbox" name="chk_list" id="chk_list_1" value="1" />1<br /> ...
本项目“jQuery+CSS3相册上传全选/取消多张图片选择动画”正是针对这一需求，提供了一种视觉效果出色且交互性强的解决方案。通过结合jQuery的事件处理和CSS3的动画特性，实现了用户在选择多张图片时的流畅体验。 ...
在JavaScript编程中，"全选/反选"是常见的用户交互功能，常见于表格、列表等数据展示场景，允许用户一次性选择或取消选择所有项目。这个功能在网页表单、电子表格应用、在线文档编辑器等领域都有广泛的应用。在本...
在JavaScript编程中，"全选反选"功能...二、JavaScript实现全选/反选 1. HTML结构： 首先，我们需要在HTML中设置一个主复选框（全选）和多个子复选框： ```html <input type="checkbox" id="selectAll"> 全选 ...
全选功能是选中所有复选框（checkbox），反选则是取消所有已选中的复选框，而取消选择通常是指取消选中最后一个作为“全选/反选”控制的复选框。 在 HTML 结构中，我们可以创建一个表格（table）来展示数据，每个行...
2. 在列表下方放置一个“全选/全不选”复选框，当选中“全选/全不选”复选框后，列表中的所有复选框都选中，当取消“全选/全不选”复选框后，列表中的所有复选框都取消选中。 3. 当列表中的复选框都取消选中后，...
JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选 JavaScript 全选全不选
在本文中，我们将深入探讨如何使用 jQuery 实现“一句话全选/取消全选”。 首先，jQuery 是一个广泛使用的 JavaScript 库，它简化了 DOM 操作、事件处理以及AJAX交互等任务，从而让开发者能够编写更简洁、更易于...
在描述中提到的“全选/全不选”功能，是多选下拉框的一种高级特性，它提供了快速选择或取消所有选项的便利。 首先，我们来看看`LovCombo.js`，这可能是一个自定义的组合框组件，扩展了ExtJS的原生ComboBox类，以...
同时，为了实现全选/取消全选功能，可以在其他事件处理函数中，例如在列表项的点击事件中，加入逻辑来同步 `select_all` 的状态。 最后，示例中的“效果图”部分通常会展示实际运行时用户看到的界面，帮助开发者...
而全选、取消全选、反选等操作，通常用于数据的批量处理，是提高效率的一种手段，因此在后台管理界面或需要用户确认的操作中较为常见。 通过上述的讲解，我们可以看到，利用jQuery对复选框进行全选、取消全选、反选...
jQuery是一种广泛应用于网页交互...首先，我们需要在HTML中创建一个“全选”按钮和一组复选框。例如： ```html <input type="checkbox" id="checkAll"> 全选 <input type="checkbox" name="option1" value="1"> 选项1 ...
在HTML中，我们通常会有一个复选框（checkbox）作为全选按钮，当用户点击这个按钮时，所有其他与之相关的复选框都会被选中。在JavaScript中，这可以通过遍历所有复选框并设置它们的`checked`属性为`true`来实现。...
首先，我们需要理解复选框全选/取消全选的基本原理。在用户点击全选复选框时，所有关联的子复选框都应该被选中；相反，当用户取消全选时，所有子复选框的选中状态应被移除。这可以通过遍历子复选框并设置或移除`...