1、从MVC返回的Json数据如下:

2、下面是客户端实现的示例:

$.post("/admin/GetPermissionsForRole", function (data,status) {
if (status == "success") {
var ghtml = "";
$.each(data, function (i, items) { //items相当于二维数组里的每一个一维数组
if (items["ParentPermissionId"] == "")
{
ghtml += "<div class='panel panel-transparent'> <ul class='list-group'>";
ghtml += "<div class='panel-heading'><i class='fa fa-list-ul'></i>&nbsp;<span class='panel-title text-bold'>" + items["PermissionName"] + "</span></div>";
ghtml += "<ul class='list-group'>";
$.each(data, function (i, sitems) {
if (sitems["ParentPermissionId"] == items["PermissionId"])
{
ghtml += "<li class='list-group-item'>";
ghtml += "<h6 class='text-bold text-semibold text-xs' style='margin:20px 0 10px 0'>";
ghtml += "<label class='px-single'><input type='checkbox' class='px'><span class='lbl'>&nbsp;</span></label>&nbsp;&nbsp;" + sitems["PermissionName"];
ghtml += "</h6>";
ghtml += "<p>";
$.each(data, function (i, ssitems)
{
if (ssitems["ParentPermissionId"] == sitems["PermissionId"])
{
ghtml += "<label class='checkbox'><input type='checkbox' class='px' /><span class='lbl'>" + ssitems["PermissionName"]+ "</span></label>";
}
})
ghtml += "</p>";
ghtml += "</li>";
} })
ghtml += "</ul></div>";
}
});
$("#premlist").html(ghtml);
}
})

3、最后要实现的效果如下:

//权限"全选或者取消"功能代码,此代码必须要放在append()的后面,不然不起作用
var xsChk = 'px';//定义的样式
var xsChkAll = "input[type='checkbox'][class='" + xsChk + "'][name]";//所有定义此样式的checkbox
$(xsChkAll).each(function () {
var name = $(this).attr("name");
name = "input[type='checkbox'][class!='" + xsChk + "'][name='" + name + "']";//此全选框下面的子checkbox
$(this).on('click', function () {
$(name).attr("checked", $(this)[].checked);
})
var xschk = $(this);
$(name).on('click', function () {
var IAll = $(name).length; //此子项目下所有checkbox的个数
var IChk = $(name + ":checked").length; //此子项目下所有勾选checkbox的个数
var isAllChecked = true; //是否是全选
if (IAll != IChk) {
isAllChecked = false;
}
$(xschk).attr("checked", isAllChecked);
});
});
//会选或者取消功能结束

Jquery 中each循环嵌套的使用示例教程的更多相关文章

  1. jQuery中each循环的跳出和结束

    jQuery中each类似于javascript的for循环 但不同于for循环的是在each里面不能使用break结束循环,也不能使用continue来结束本次循环,想要实现类似的功能就只能用ret ...

  2. jQuery源码分析-jQuery中的循环技巧

    作者:nuysoft/JS攻城师/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. 前记:本文收集了jQuery ...

  3. JS中for循环嵌套

    for 循环 for语句也是一种前测试循环语句,但它具有在 执行循环之前初始化变量 和 定义循环后要执行的代码的能力 for循环中专门提供了位置来放置循环的三个表达式 定义一个循环需要做实现这三步: ...

  4. tonado框架的列表嵌套 (template中for循环嵌套)

            学习了tonado框架,渐渐开始明白模板的转换,以后肯定还会遇到很多问题... 功能描述:       页面显示读取的数据库父导航名称,再通过嵌套列表将子导航名称和地址查询出来,返回到 ...

  5. jquery中each遍历对象和数组示例

    通用遍历方法,可用于遍历对象和数组.$().each(),回调函数拥有两个参数: 第一个为对象的成员或数组的索引,第二个为对应变量或内容.如需退出each循环可使回调函数返回false 现有如下两个s ...

  6. JS中的循环嵌套 BOM函数

    [嵌套循环特点]                           外层循环转一次,内层循环转一圈              外层循环控制行数,内层循环控制每行元素个数             [做 ...

  7. JS&Jquery中的循环/遍历

    JavaScript中的遍历 for 遍历 var anArray = ['one','two']; for(var n = 0; n < anArray.length; n++) { //具体 ...

  8. jquery中for循环

    1.循环遍历标签 //定义数组 var imagesPath=[]; //循环遍历对象 $("#uploadList li img").each(function(){ image ...

  9. jquery中div悬浮嵌套按钮效果

    <div class="btn_sure_cai" style="margin-left: 0px;" onmouseover="show_hi ...

随机推荐

  1. BZOJ 1806: [Ioi2007]Miners 矿工配餐( dp )

    dp... ------------------------------------------------------------------------------- #include<cs ...

  2. UNIX/Linux进程间通信IPC---管道--全总结(实例入门)

    管道 一般,进程之间交换信息的方法只能是经由fork或exec传送打开文件,或者通过文件系统.而进程间相互通信还有其他技术——IPC(InterProcessCommunication) (因为不同的 ...

  3. spoj 3871 gcd extreme

    题目大意给出一个n,求sum(gcd(i,j),<i<j<=n); 可以明显的看出来s[n]=s[n-]+f[n]; f[n]=sum(gcd(i,n),<i<n); 现 ...

  4. 【xcode】错误之Could not launch "" failed to get the task for process

    http://blog.csdn.net/teng_ontheway/article/details/8467932 在Xcode下编译工程正常,在模拟器下运行正常,最后在真机上运行的时候出现了如下错 ...

  5. C语言之猜数字游戏

    猜数字游戏 猜数字游戏是以前功能机上的一款益智游戏,计算机会根据输入的位数随机分配一个符合要求的数据,计算机输出guess后便可以输入数字,注意数字间需要用空格或回车符加以区分,计算机会根据输入信息给 ...

  6. QT学习 之 事件与事件过滤器(分为五个层次)

    事件 在Qt中,事件是作为对象处理的,所有事件对象继承自抽象类QEvent.此类用来表示程序内部发生或者来自于外部但应用程序应该知道的动作.事件能够能过被 QObject 的子类接受或者处理,但是通常 ...

  7. python yaml使用

    YAML Ain't Markup Language 和GNU一样,YAML是一个递归着说“不”的名字.不同的是,GNU对UNIX说不,YAML说不的对象是XML. YAML不是XML. 为什么不是X ...

  8. cocos2d-x游戏开发系列教程-超级玛丽09-怪物激活与移动

    在游戏中,很多怪物本身是会移动的,这里主要有蘑菇怪,乌龟等. 说起怪物的移动,首先在游戏里先要考虑怪物的抽象和设计. 在CMMonster.h中,有个类CMMonsterBasic,这个类抽象了所有的 ...

  9. hdu 1242 Rescue(bfs)

    此刻再看优先队列,不像刚接触时的那般迷茫!这也许就是集训的成果吧! 加油!!!优先队列必须要搞定的! 这道题意很简单!自己定义优先级别! +++++++++++++++++++++++++++++++ ...

  10. SWIFT学习笔记01

    1.Swift.用来推断option是不是nil,相当于OC的 if(option) if let name = option{ greeting = "if=====" }els ...