“运行代码”后需要“刷新一次”:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script language="javascript" type="text/javascript" src="http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js"></script>
<script language="javascript" type="text/javascript">
$.fn.checkCbx = function(){
return this.each(function(){
this.checked = !this.checked;
});
}
$(function(){
$("#btnSelect").click(function(){
this.value = this.value == "全选"?"反选":"全选";
$("input:checkbox").checkCbx();
})
})
</script>
</head>
<body>
<form name="form1" method="post" action="Default8.aspx" id="form1">
<table border="1">
<tr>
<th>选择</th>
<th>id</th>
<th>姓名</th>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>1</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>2</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>3</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>4</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>5</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>6</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>7</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>8</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>9</td>
<td>脚本之家</td>
</tr>
<tr>
<td><input type="checkbox" name="cbx" /></td>
<td>10</td>
<td>脚本之家</td>
</tr>
</table>
<input id="btnSelect" type="button" value="全选" />
</form>
</body>
</html>
分享到:
相关推荐
本主题将深入探讨jQuery中的"全选"与"反选"功能,这是一个常见且实用的功能,尤其是在处理多选框(Checkbox)的场景中。 全选与反选功能在用户界面设计中十分常见,例如在批量选择数据项、同意服务条款或选择订阅...
本教程将深入探讨如何使用jQuery实现全选和反选功能,这在多选列表或表格中非常常见,例如在批量处理数据时。 全选和反选功能的核心在于同步用户界面中的复选框状态。当用户点击一个主复选框(通常标记为“全选”)...
本文将详细讲解如何通过JS和jQuery实现checkbox的全选、反选以及全不选功能。 首先,我们需要理解HTML中的复选框元素`<input type="checkbox">`,它允许用户在一组选项中进行多选。为了实现全选、反选和全不选的...
"jquery全选反选全不选案例" 是一个常见的交互功能,常见于表格或者列表中,允许用户一键选择或取消所有选项。这个功能在数据筛选、批量操作等场景下非常实用。 实现这一功能的关键在于理解 jQuery 中的选择器和...
jquery实现checkbox全选、反选、全部选,很不错的资源,欢迎大家下载学习var langType=""; var arLangType = []; $("[name='langType'][checked]").each(function(i) { arLangType[i]=$(this).val(); }); ...
反选功能与全选类似,只是在全选的基础上改变逻辑。当用户取消顶级节点的选中状态时,所有子节点都应该被取消选中。代码如下: ```csharp private void UnselectAllNodes(TreeNode node) { node.Checked = ...
本文将深入探讨jQuery中关于“全选”、“反选”以及“获取选中值”的相关知识点,帮助你更好地理解和应用这些功能。 ### 一、jQuery全选 全选功能通常应用于多选列表或表格中,允许用户一次性选择所有选项。在...
### jQuery与JavaScript操作Checkbox全选反选 #### 一、引言 在Web开发中,Checkbox(复选框)是一种非常常见的用户界面元素,用于收集用户的多选输入。尤其是在表单设计时,Checkbox的全选与反选功能极大地方便了...
在开发用户界面时,特别是在涉及到多选列表时,全选和反选功能是常见的需求。本教程将详细介绍如何在WPF中实现CheckBox的全选和反选功能。 首先,我们需要理解CheckBox的基本用法。在XAML中,我们可以创建一个...
反选功能与全选类似,但它的目的是取消所有已选中的复选框。以下是一个反选的JavaScript示例: ```javascript function deselectAll() { var checkboxes = document.getElementsByName('checkboxName'); for (var...
这可以通过监听全选Checkbox的`CheckedChanged`事件来实现,然后遍历DataGridView的所有行,设置每一行的Checkbox为与全选Checkbox状态一致。 - **反选功能**:反选意味着取消所有已选中的项。这可以通过再次触发...
在JavaScript和jQuery中,全选和反选功能是常见的交互设计,主要用于用户界面中的复选框操作。在表格、列表或者其他需要多选的场景中,全选和反选功能能够大大提高用户体验。以下将详细介绍如何使用JavaScript和...
全选和反选功能在多选列表中尤其常见,例如在批量操作或者多条件筛选时。以下是三种实现Checkbox全选和反选的方法,以及它们的JavaScript和Java实现细节。 ### 方法一:使用`checked`属性 **JavaScript实现**: 在...
全选与反选 <input type="checkbox" id="selectAll" onclick="selectAll()"> 全选 <input type="checkbox" name="item" value="1"> <input type="checkbox" name="item" value="2"> <input type=...
在这个例子中,我们将详细解析如何使用jQuery 1.4.2版本实现复选框的全选和反选功能。 首先,我们需要引入jQuery库。在HTML代码中,可以看到引入了`jquery-1.4.2.min.js`文件,这是jQuery的核心库: ```html ...
### Vue+Vant-UI框架实现购物车复选框全选和反选功能 #### 1....在实际应用中,除了全选与反选之外,还可以进一步扩展更多功能,例如批量删除、价格计算、库存检查等,为用户带来更流畅的购物体验。
如果这是一个源码文件,那么它应该包含了上述提到的jQuery实现的复选框全选反选功能的完整代码。 总结起来,这个基于jQuery的全选、反选复选框插件源码例子涉及到了jQuery的选择器、属性操作、事件处理、可能还有...