前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑。。。

1.ztree子节点横向显示(下图):

效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5个(修改位置在zTreeStyle.css里面哦,在外面设置不上的,页面也获取不到想要设置样式的节点。。。如果你能还望赐教)代码如下:

 .ztree>li>ul>li>ul>li>ul{overflow:hidden;}
.ztree>li>ul>li>ul>li>ul>li{float: left;width: 19%;height:46px;box-sizing: border-box; }

代码很简单,只是当初自己找起来不是很好找,并且一定加高度哦(坑1),不加高度如果还有4级子节点的话点击收缩和展开会影响布局滴~~~

2.点击文字勾选当前文字前对应的“input”:

这个效果其实挺简单的,默认点击文字是不勾选当前input的(ztree中用span给css表示)效果只要两行代码哦:

//点文字勾选
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
// treeObj.checkNode(treeNode, !treeNode.checked, true); //切换勾选状态
treeObj.checkNode(treeNode, true, true);

注意:此代码写在配置的方法的onclick事件函数中哦~~

3.去除指定位置input的勾选状态:

for(var i=0; i<idAttr.length ; i++){

                $NodeByParamS    = treeObj.getNodeByParam("id", idAttr[i], null);
treeObj.checkNode($NodeByParamS, false, true);//取消勾选
}
treeObj.checkNode(坑2_没“s”) 通过 zTree 对象执行此方法,根据节点数据的属性搜索,获取条件完全匹配的节点数据 JSON 对象;
4.待续...先写这三个吧......

Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态的更多相关文章

  1. {二逼小青年的记事簿}为什么treelist不会显示子节点的文字?

    <TreeView Name="treeView" DockPanel.Dock="Left" MinWidth="200" > ...

  2. zTree实现删除树子节点

    zTree实现删除树子节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</tit ...

  3. C# TreeView的CheckBox 父/子节点点击联动选择效果

    注: 点击时请正常速度点击,不然会出现“奇怪”现象!!! /// <summary> /// 节点点击 子级->同级->父级 /// </summary> /// ...

  4. zTree模糊搜索,显示全部节点和高亮显示

    function searchFun() { var value; if($("#code2").val()!=null && $("#code2&quo ...

  5. Winform CheckBox组,先横向排列,后纵向排列,点击文字,改变Checkbox的状态的方法

      开始选用的CheckedListBox控件,不能实现,改为使用ListView控件,可以满足需求.操作步骤如下: 1.将ListView的属性View改为SmallIcon. 2.CheckBox ...

  6. jquery实现点击页面其他地方隐藏指定元素

    代码实例如下: <!DOCTYPE html><html><head><meta charset=" utf-8"><meta ...

  7. jquery zTree 查找所有的叶子节点

    jquery zTree 查找所有的叶子节点 // 保存所有叶子节点 10 为初始化大小,并非数组上限 var arrayObj = new Array([10]); /* treeNode: 根节点 ...

  8. Ztree右键事件,如何让指定的子节点不显示右键菜单。

    这里我记录一下我自己的解决方案: 1.首先在Ztree的setting设置中加一个鼠标右键回调函数onRightClick,然后在加一个beforeRightClick(具体含义可以看官方API) v ...

  9. 把zTree前的展开收起图标改为三角形,且只有在点击三角形图标时才展开子节点解决方案

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...

随机推荐

  1. JS练习题

    1.带参数的函数不能重复调用 2.顺序语句: 3.在重复调用中打断 调用用 return   例如: Interval 时间间隔   先清一下  再接着 return:其他的调用也可以加return打 ...

  2. C# 中间语言、CLR、CTS、CLS

    c#  中间语言.CLR.CTS.CLS IL中间语言,区分大小写 中间语言的主要特征: 1.  面向 对象和使 用接口 2. 值类型和引 用类 型之间的 显 著差异 3.  强 数据类型化 4. 使 ...

  3. linux加入windows域之完美方案(转载)

    概念理解:1.kdc:可信任的密钥分发中心(KDC, Key Distribution Center).2.Winbind是Samba套件的功能之一.它允许Unix系统利用Windows NT的用户帐 ...

  4. httplib,urllib和urllib2

    一.httplib实现了HTTP和HTTPS的客户端协议,一般不直接使用,在python更高层的封装模块中(urllib,urllib2)使用了它的http实现. import httplib con ...

  5. asp.net应用发布到IIS无法链接到oracle数据库

    遇到这个问题纠结了好久,试了好多的方法,其中我的问题是,先安装了.net frameword4然后又安装的IIS. 正确方式应该是先安装IIS 然后安装.net framework;且应用程序池没有启 ...

  6. linux系统下,安装centos7.0系统,配置网卡出现的问题(与centos5.x、centos6.x版本,有差异)

    1.新建虚拟机时,自己下载的是centos64系统,选择系统时,默认选择centos,而未选择centos64位,导致犯了一个低级错误,导致后面网卡安装一直有问题 2.查看ip命令与centos5.x ...

  7. Mysql从库复制的2个问题

    .为什么执行stop slave; 再start slave;可以继续主从关系呢? 其实执行stop slave;就是分别关闭了I/O线程(stop slave IO_THREAD;)和SQL线程(s ...

  8. Maltego——互联网情报聚合工具初探(转)

    有时候你可曾想过,从一个Email,或者Twitter,或是网站,甚至姓名等等,能找到一个人千丝万缕的联系,并把这些联系整合,利用起来?Maltego就是这样一款优秀而强大的工具.Maltego允许从 ...

  9. 字典重复key的合并

    from collections import defaultdict d=defaultdict(set) s=[("001","A"),("001 ...

  10. 『Linux基础 - 2 』操作系统,Linux背景知识和Ubuntu操作系统安装

    这篇笔记记录了以下几个知识点: 1.目前常见的操作系统及分类,虚拟机 2.Linux操作系统背景知识,Windows和Linux两个操作系统的对比 3.在虚拟机中安装Ubuntu系统的详细步骤 OS( ...