Jquery全选与反选checkbox（代码示例）
今天在公司要实现操作权限的功能，需要根据左边的树，选择一项，判断右边的操作权限，例如，增加，修改，删除，查看等按钮的显示与隐藏；
这个功能实现思路如下：
1、操作权限：增加、修改等按钮的ID和Text是保存在xml文件中；
2、选择一项，加载xml文件中的按钮数据，显示在右边的页面，以checkbox展示；
3、全选checkbox，则选择所有的checkbox，取消则一个则全选按钮也取消选中；
4、将list集合转成json格式，传输到后台保存，后台每次增加与修改都会判断是否存在，不存在则新增，存在则修改；
整个功能都已实现，全选功能参考了网上的代码。
自己补充代码：选中一个后，全选按钮要取消选中；
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CheckAll_Example.aspx.cs" Inherits="FormEditor.CheckAll_Example" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Jquery全选与反选checkbox</title>
<script src="Scripts/jquery-1.9.1.js"></script>
</head>
<body>
<div class="divCheckAll">
<input type="checkbox" name="chk_list" id="chk_list_1" value="" onclick="IsCheckAll()" /><br />
<input type="checkbox" name="chk_list" id="chk_list_2" value="" onclick="IsCheckAll()" /><br />
<input type="checkbox" name="chk_list" id="chk_list_3" value="" onclick="IsCheckAll()" /><br />
<input type="checkbox" name="chk_list" id="chk_list_4" value="" onclick="IsCheckAll()" /><br />
</div>
<input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选
<script type="text/javascript">
$("#chk_all").click(function () {
$("input[name='chk_list']").prop("checked", $(this).prop("checked"));
}); function IsCheckAll() {
var totalCount = $(".divCheckAll").find("input[name='chk_list']").length;
var count = ;
$(".divCheckAll").find("input[name='chk_list']").each(function () {
//选中加一
if ($(this).prop("checked")) {
count++;
}
});
if (count < totalCount) {
$("#chk_all").prop("checked", false);
} else {
$("#chk_all").prop("checked", true);
}
}
</script>
</body>
</html>
PS：刚刚又修改了一段代码：一个一个选中，如果全部选中时，全选按钮要选中。
Jquery全选与反选checkbox（代码示例）的更多相关文章
- Jquery 全选、反选问题解析
最近工作中,需要使用Jquery实现复选框的全选和反选,本人虽然不是专职撸前端的,但这个小问题感觉也没什么难度,下面直接上代码: <div id="list"> < ...
- jquery 全选、反选、获取值、背景行、隔行变色和鼠标略过变色变色全特效
好久没有写东西了,当然不是没东西可写,只是没有时间写.今天抽出点时间来把我最近使用的一些 Javascript 特效的东西贴出来,供自己或者别人查询使用.最近我在做一个新的 B/S 系统,由于没有专门 ...
- jQuery 全选和反选demo
前段时间做了一个全选和反选的功能,最近不忙了,做了一个简化版的demo. 全部代码如下: <!DOCTYPE html> <html> <head> <tit ...
- JavaScript内容梳理 示例之模态对话框 示例之全选和反选以及取消 示例之后台管理左侧菜单
<!DOCTYPE html> <!--示例之模态对话框--> <html lang="en"> <head> <meta c ...
- jQuery全选与反选，且解决点击只执行一次的问题
<html> <head> <script src="jquery-1.11.1.min.js" type="text/javascript ...
- 基于jquery 全选、反选、各行换色、单击行选中事件实现代码
<script language="javascript"> $(document).ready(function(){ //各行换色 $('table tr:odd' ...
- Jquery 全选、反选
jQuery 1.9以后用 prop(); 不用attr 等 $(function() { $('#inputCheck').click(function() { $("input[name ...
- jQuery全选、反选、全不选
原文链接:https://yq.aliyun.com/articles/33443 HTML内容部分: <ul id="items"> <li> <l ...
- Jquery 全选、反选问题的记录
<div id="list"> <ul id="choseList" > <li><input type=" ...
随机推荐
- HDOJ --- Super Jumping! Jumping! Jumping!
Super Jumping! Jumping! Jumping! Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 ...
- PHP两个字符串比较（人为出错），两字符串类型和数据表面相等，但strcmp()结果不为0
PHP中,比较两个字符串是否相等用:strcmp(): PHP strcmp() 函数 PHP String 函数 定义和用法 strcmp() 函数比较两个字符串. 该函数返回: 0 - 如果两个字 ...
- .net 码农转战 iOS - 初探
好久没写博客了,之前还打算把毕业设计中涉及到的两个算法拿出来说说(脸型分析 + 声音分析),博文都写了一半了,后来实在太忙了,那篇随笔也就沉在草稿列表中没动过. 我原先是专职 .net 开发的,在公司 ...
- Android NDK开发Crash错误定位[转]
使用 ndk-stack 的时候需要你的 lib 编译为 debug版的,通常需要下面的修改: 1. 修改 android.mk,增加,为 LOCAL_CFLAGS 增加 -g 选项 2. 修改 ap ...
- hdoj 1827 Summer Holiday【强连通分量&&缩点】
Summer Holiday Time Limit: 10000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)T ...
- .net互转java 转行必备
.net与java其实是差不多的语言,学习起来只需要弄清楚差异及查库的方法,转起来还是很快的 以下列出几点,希望能给正在转行的你一些帮助 1,java与c#语言超详细对比 http://www.har ...
- 三种排序算法python源码——冒泡排序、插入排序、选择排序
最近在学习python,用python实现几个简单的排序算法,一方面巩固一下数据结构的知识,另一方面加深一下python的简单语法. 冒泡排序算法的思路是对任意两个相邻的数据进行比较,每次将最小和最大 ...
- jsp-javabean-setproperty介绍
李兴华<java web开发实战经典>第7章关于javabean的讲解中说道:<jsp:setProperty>标签一共有4种使用方法·下面列出了4种操作语法的格式: 设置 ...
- java与javax有什么区别？
java 是java j2sdk 中的类库,也就是Java Development kit . 它提供也一些基础的东西,如io库.桌面程序的类库,如awt.集合库(如Collection.List.M ...
- JSP/Servlet 中的事件处理
写过AWT或Swing程序的人一定对桌面程序的事件处理机制印象深刻:通过实现Listener接口的类可以在特定事件(Event)发生时,呼叫特定的方法来对事件进行响应. 其实我们在编写JSP/Serv ...