- 浏览: 112572 次
文章分类
最新评论
CHECKBOX的操作在页面中很常见,比如全选、取消、跨页保存等等,下面有个不错的示例,大家可以尝试操作下
代码:
代码:
<script> $(document).ready(function () { /** *全选checkbox *by www.jbxue.com 脚本学堂 */ $(".checkall").live("click", function () { if ($(this).attr("checked") == "checked") {//如果选中 CheckAll(); } else { UnCheckAll(); } UpdateHfValues(); }); $(".checkone").each(function () { $(this).live("click", function () { CheckOne(); UpdateHfValues(); }); }); function UnCheckAll() { //取消全选 $(".checkone").each(function () { $(this).removeAttr("checked"); }); } function CheckAll() { //全选 $(".checkone").each(function () { $(this).attr("checked", "checked"); }); } function CheckOne() { //单击单条消息时检验是否全选 var $length = $(".checkone").length; var $checklenght = $(".checkone:checked").length; if ($length == $checklenght) { $(".checkall").attr("checked", "checked"); } else { $(".checkall").removeAttr("checked"); } } var arr = $("#hfDel").val().split(","); $(".checkone").each(function () { var i = 0; for (i = 0; i < arr.length; i++) { if (arr[i] == $(this).val()) { $(this).attr("checked", "checked"); } } }); var checkedNum = $(".checkone:checked").length; var allNum = $(".checkone").length; if (checkedNum == allNum) { $(".checkall").attr("checked", "checked"); } function UpdateHfValues() { var $checkOneLen = $(".checkone:checked").length; var $conVal = ""; $(".checkone:checked").each(function (i) { $conVal += $(this).val() + ","; }); if ($conVal.length > 0) { $conVal = $conVal.substring(0, $conVal.length - 1); } $conVal = $conVal + "," + $("#hfDel").val(); var allArray = $conVal.split(","); $(".checkone").each(function () { if (typeof $(this).attr("checked") != "undefined" && $(this).attr("checked") == "checked") { var i = 0; var find = false; for (i = 0; i < allArray.length; i++) { if (allArray[i] == $(this).val()) { find = true; } } if (find == false) { allArray.push($(this).val()); } } else { var i = 0; for (i = 0; i < allArray.length; i++) { if (allArray[i] == $(this).val()) { allArray[i] = ""; } } } }); var i = 0; var result = ""; for (i = 0; i < allArray.length; i++) { if (allArray[i] != "") { result += allArray[i] + ","; } } if (result.length > 0) { result = result.substring(0, result.length - 1); } $("#hfDel").val(result); } function UpdateValues() { alert($("#hfDel").val()); var $checkOneLen = $(".checkone:checked").length; var $conVal = ""; $(".checkone:checked").each(function (i) { $conVal += $(this).val() + ","; }); $conVal = $conVal.substring(0, $conVal.length - 1); $("#hfDel").val($conVal); } $("#btnDeletes").unbind("click").live("click", function () { if ($("#hfDel").val() != "") { if (confirm("确定要启用用选中的选项吗?")) { return true; } else { return false; } } else { alert("您尚未选中要启用的选项!"); return false; } }); $("#lbTingYong").unbind("click").live("click", function () { if ($("#hfDel").val() != "") { if (confirm("确定要停用选中的选项吗?")) { return true; } else { return false; } } else { alert("您尚未选中要停用的选项!"); return false; } }); }); <script> <input type="checkbox" id="ckAll" class="checkall" onclick="checkAll(this)" /></div> <input type="checkbox" id="iCheck" class="checkone" value='<%#Eval("cSubjectDetailID") %>' /> <asp:HiddenField ID="hfDel" runat="server" />
发表评论
-
js中递归函数的使用方法例子
2014-08-25 16:54 884转自:http://blog.csdn.net/jbxue1 ... -
js刷新页面方法大全(收藏)
2014-03-22 17:53 563收藏一些js刷新当前页面的方法,这个在编程中经常用得到,正在 ... -
jquery右下角弹出提示框的实现代码
2013-10-08 21:16 1263右下角弹出提示框想必大家都有见到过吧,其实有实现方法有很多,本 ... -
javascript实现复选框只能选择一项
2013-10-08 21:13 674分享下javascript实现复选框只能选择一项的方法。 ... -
javascript 函数声明与函数表达式的区别介绍
2013-10-06 23:13 493javascript中的函数声明与函数表达式使用比较频 ... -
javascript自启动函数的问题探讨
2013-10-06 23:11 660javascript的自启动函数。 两段代码: ... -
iframe自适应高度的多种方法方法
2013-09-27 11:14 780不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情 ... -
分享三个iframe自适应高度的例子
2013-09-27 11:10 492iframe自适应高度 本文介绍下,iframe自适应高度的例 ... -
jquery刷新页面的方法
2013-09-27 10:47 831局部刷新: 常见的有以 ... -
jquery根据ID填充文本框的代码示例
2013-07-03 16:54 803根据ID填充文本框的小例子。 需要引入外部jquery框架。 ... -
js实现禁止刷新与回退的代码
2013-05-10 22:59 988禁止页面刷新,用javascript代码即可轻松实现,来看本文 ... -
Js动态添加复选框Checkbox的方法
2013-04-08 22:14 2308Js动态添加复选框Checkbox的实例方法!!! 首先,使 ... -
Jquery图片滚动与幻灯片的实例代码
2013-04-08 22:12 802Jquery图片滚动与幻灯片的实例代码!! 1、图片滚动 ...
相关推荐
这个项目("PHP checkbox全选及提交到PHP")涵盖了前端的全选功能实现,后端的PHP接收表单数据,以及可能涉及的数据库操作。了解这些知识点有助于构建一个完整的用户交互系统,允许用户在网页上选择多个选项并将其...
本教程将深入探讨如何使用CheckBox实现多选、全选和反选功能,这对于构建具有选择列表的应用非常关键。 首先,我们从基础开始。CheckBox的用法很简单,通常在XML布局文件中定义: ```xml <CheckBox android:id="@...
在描述中提到的“C# grid checkbox 全选”是指在C#中使用数据网格(通常为DataGridView或DevExpress的GridView)控件时,实现表头复选框全选功能的技术。这个功能常见于数据管理界面,允许用户一键选择或取消选择...
在“Bootstrap Table 跨页选择”这个主题中,我们主要关注的是如何在实现后台分页的表格中实现用户在不同页面选择行的功能,并能持久保存和恢复这些选择。 在传统的Bootstrap Table中,用户可能只能在当前页面进行...
在Java Web开发中,实现checkbox跨页多选功能是一项常见的需求,特别是在数据量大、需要分页展示的情况下。这个功能允许用户在多个页面上选择不同的选项,并在提交时能够保存所有选择,无论这些选项分布在多少个页面...
在许多场景下,我们需要在ListView中加入复选框(CheckBox),实现多选、全选和反选的功能,例如在选择联系人、设置菜单等场景。这个“带CheckBox的listView”项目就是为了解决这类需求而设计的,并且已经解决了常见...
"C#_winform_GridView_CheckBox_多选_全选"这个主题就专门探讨了如何在WinForm的GridView中实现复选框的多选和全选功能。 首先,我们需要理解GridView的基本用法。GridView是.NET Framework中的System.Windows....
1. 使用JavaScript操作DOM,实现全选/取消全选功能。 2. 使用数据结构(如JavaScript对象或数组)存储各分页的选中状态。 3. 在分页切换时,根据存储的数据恢复和更新选中状态。 通过这些步骤,我们可以创建一个...
- 实现全选和取消全选功能,通常会添加一个主CheckBox,当它被选中时,所有ListView中的CheckBox都应被选中;反之,所有CheckBox取消选中。 - 当主CheckBox的状态改变时,遍历数据源,更新布尔数组,然后调用`...
根据提供的文件信息,本文将详细解析“全选和复选,并把结果保存到数据库”的实现原理及技术要点。本文档中的代码片段展示了如何在JSP页面中实现全选与复选功能,并通过JavaScript来控制各个复选框的状态,最终目的...
然而,当需要在ListView中集成CheckBox以便实现多选、全选和反选功能时,开发者往往会遇到一些挑战,因为ListView的复用机制可能导致CheckBox的状态无法正确保存。本文将详细介绍如何在Android中实现一个带有...
有时候,我们希望在表格的表头中添加复选框,以便实现全选或取消全选的功能,这在处理大量数据时尤其有用。本篇文章将详细解释如何在`QTableWidget`的表头中添加复选框并实现全选功能。 首先,我们需要了解`...
实现ListView的单选、多选、反选以及全选功能是常见的需求,尤其是在需要用户进行多项选择的场景下。下面将详细介绍如何实现这些功能。 首先,我们需要一个适配器(Adapter)来填充ListView的数据。适配器通常继承...
1. 反向全选:有时,用户可能希望取消已选中的所有复选框,这可以通过添加一个反向全选的功能实现。只需在全选复选框的事件处理函数中添加一句`this.checked = !this.checked`,即可实现全选/反选切换。 2. 交互...
本项目"仿58同城android listview中的全选、取消、反选、删除、编辑、完成多种操作"旨在实现与58同城旧版类似的交互功能,提供了一个完整的示例,帮助开发者了解如何在ListView中集成多种操作。 首先,ListView的...
本教程将详细讲解如何实现ListView中的全选删除功能,结合checkBox(复选框)进行多条记录的选择与批量删除。 1. **ListView基础** - ListView是Android提供的一个可滚动视图,常用于展示大量数据,如联系人列表或...
本示例"Android-ListView"专注于在ListView中嵌套另一个ListView,并且添加了CheckBox功能,支持全选、反选以及单选操作,这在实现类似淘宝购物车功能时非常常见。以下是关于这个Demo的详细知识点: 1. **ListView...
实现全选功能,我们需要一个顶级节点(通常是TreeView的根节点)的CheckBox,当用户点击这个CheckBox时,所有的子节点都应该被选中。可以通过递归调用来实现这一点,如下: ```csharp private void ...