var newOpen =null; $(function () { //初始化数据 var data = [{"id":"20170525091439001010","name":"企业注册","pId":null,"status":"1","typecode":"02"},{"id":"20170724174119005610","name":"部门沟通演练","pId":"20170525091439001010","status":"1","typecode":"2"},{"id":"20170725085455000110","name":"测试12","pId":null,"status":"1","typecode":"11"},{"id":"20170731171011000410","name":"审批流程","pId":null,"status":"1","typecode":"222"},{"id":"20170803133941018010","name":"单位登记","pId":null,"status":"1","typecode":"188"},{"id":"20170804085419000110","name":"模拟","pId":null,"status":"1","typecode":"122"},{"id":"20170809090321000110","name":"审批模拟(新)测试测试测试测试测试","pId":"20170525091439001010","status":"1","typecode":"110"},{"id":"20170809105407009210","name":"测测测测测测测测测测测测测测测测测测","pId":"20170809090321000110","status":"1","typecode":"123"},{"id":"20170814183837000210","name":"企业登记","pId":null,"status":"1","typecode":"111"},{"id":"20170822183437000710","name":"单事项-部门沟通","pId":"20170814183837000210","status":"1","typecode":"822"},{"id":"20170922112245000510","name":"23","pId":null,"status":"1","typecode":"03"},{"id":"20170922143810000010","name":"sdfa","pId":null,"status":"1","typecode":"04"},{"id":"20170922145203000110","name":"64526","pId":null,"status":"1","typecode":"34262"},{"id":"20170922155403001610","name":"333","pId":null,"status":"1","typecode":"33354"},{"id":"20170922171750000210","name":"4441234","pId":null,"status":"1","typecode":"44444"},{"id":"20170925160636007410","name":"测试数据","pId":"20170731171011000410","status":"1","typecode":"231"},{"id":"20170925163306007510","name":"23462111","pId":null,"status":"1","typecode":"2345"},{"id":"20170925163959007610","name":"242345","pId":"20170922112245000510","status":"1","typecode":"3625346"}]; queryHandler(data); }); var setting = { view: { showLine: false, addDiyDom: addDiyDom, }, data: { simpleData: { enable: true } } }; /** * 自定义DOM节点 */ function addDiyDom(treeId, treeNode) { var spaceWidth = 15; var liObj = $("#" + treeNode.tId); var aObj = $("#" + treeNode.tId + "_a"); var switchObj = $("#" + treeNode.tId + "_switch"); var icoObj = $("#" + treeNode.tId + "_ico"); var spanObj = $("#" + treeNode.tId + "_span"); aObj.attr('title', ''); aObj.append('

"; switchObj.before(spaceStr); //图标垂直居中 icoObj.css("margin-top","9px"); switchObj.after(icoObj); var editStr = ''; //宽度需要和表头保持一致 editStr += '

' + (treeNode.typecode == null ? '' : treeNode.typecode ) + '

'; editStr += '

' + (treeNode.status == '1' ? '有效' : '无效' ) + '

'; editStr += '

' + opt(treeNode) + '

'; aObj.append(editStr); } //初始化列表 function queryHandler(zTreeNodes){ //初始化树 $.fn.zTree.init($("#dataTree"), setting, zTreeNodes); //添加表头 var li_head = '

类型名称
类型编码

' + '

是否有效
操作

'; var rows = $("#dataTree").find('li'); if (rows.length > 0) { rows.eq(0).before(li_head) } else { $("#dataTree").append(li_head); $("#dataTree").append('

无符合条件数据

') } } function opt(treeNode) { var htmlStr = ''; htmlStr += ''; htmlStr += ''; return htmlStr; }

html5表格树,利用ztree实现树形表格相关推荐

  1. Vue + Element 表格拖拽排序、树形表格拖拽排序

    今天给大家分享一下表格(列表)及树形表格拖拽排序,树形表格排序的教程不多,可能还会有问题,我在这里详细给大家讲解一下,如果你有这样的需求或觉得有用,请给个关注或收藏一下吧,方便后期查看使用. 安装so ...

  2. java如何画出表格_Java利用iText7画个性化表格

    Java利用iText7画个性化表格 Java利用iText7画个性化表格 有时PDF中会出现非传统等行等列表格,下面介绍如何画个性化表格 (需要安装iText7插件哦)(官网http://devel ...

  3. php获取excel表格内容,利用PHPExcel如何读取表格中内容

    利用PHPExcel如何读取表格的内容呢?话不多说,下面的这篇文章将给大家详细的介绍关于PHPExcel读取表格中内容的方法. 先引入类IOFactory.phprequire_once '../PH ...

  4. c语言读取excel表格_利用pandas处理excel表格

    这不是一篇详细介绍pandas的文章,只是我在利用python处理excel表格时找到的一些临时方案,为了避免忘记,记录在这里,也可能对你有帮助. pandas在对excel处理上使用的是xlrd和x ...

  5. php实现生成word表格,TP5利用phpforword生成word表格文档

    TP5利用phpforword生成word表格文档 2019-12-18 573 1.首先用composer安装下载 phpoffice/phpforwordcomposer require phpo ...

  6. CorelDRAW利用图纸工具制作表格(一)

    在CorelDRAW制作表格的方法是多种的,除了使用网格工具,很多朋友认为图纸工具更为便捷,使用图纸工具绘制网格要预先设置行数和列数.它所绘制出来的网格是由一组矩形组合而成的,这些矩形可以拆分或者合并 ...

  7. 【Axure教程】用中继器制作树形表格

    树形表格在系统中是非常常用的表格类型,可以反映父级和子级关系,可以快速查看全局数据,也可以下钻查看详细的数据.因为Axure里只提供了基础的表格元件,没有提供树形表格的元件,所以今天作者就教大家如果用 ...

  8. bootstrap 树形表格渲染慢_layUI之树状表格异步加载组件treetableAsync.js(基于treetable.js)...

    概述 后台框架中使用树状表格是非常常用的操作,layUI本身并没有这种组件. 第三方的treetable.js做到了完美的实现,但是不能实现在双击时异步加载数据,本文就是站在了巨人的肩膀上实现的异步加 ...

  9. 利用HTML5新特性实现拖拽交换表格单元格元素

    利用HTML5新特性实现拖拽交换表格单元格元素 HTML5新特性:拖放 拖放 拖放(Drag 和 Drop)是很常见的特性.它指的是您抓取某物并拖入不同的位置. 拖放是 HTML5 标准的组成部分:任 ...

最新文章

  1. Linux下磁盘读写优化的分析
  2. C#连接mysql数据库的一个例子和获取本机IP的方法
  3. 一、学爬虫前,你需要知道的爬虫常识
  4. Mysql 主从数据库同步详解
  5. linux之通过tail命令动态跟踪日志文件里面的末尾信息
  6. PHP解决方案@时间差异计算函数
  7. SLAM Cartographer(4)对象Node
  8. 软件版本号命名规范_如何才能给文件合理命名,提高工作效率?我有3个建议!...
  9. php 正则表达式 文档,php的正则表达式完全手册
  10. Android应用开发的一些思考
  11. 【STM32】8.简单呼吸灯的制作教程,附代码、效果视频
  12. PLSQL导入导出表结构及数据
  13. 计算机病毒的特点分类危害性,计算机病毒的分类及破坏是什么
  14. mysql datesub interval_Mysql之INTERVAL与DATE_SUB与EXTRACT函数的使用
  15. BBN:Bilateral-Branch network with cumulative learning for long-tailed visual recognition
  16. python笔记2 - 函数,表达式,语句
  17. 用pyecharts画地图(世界地图、中国省级地图、市级地图、某省市级地图、某市县级地图)
  18. 织梦网站转移服务器,DEDE织梦网站转移空间换域名方法
  19. 邮购了正版蓝光碟《CODEnbsp;GEASS叛逆…
  20. 使用PN532向小米手环写入加密卡(复制门禁卡)

热门文章

  1. linux mysql root用户密码_Linux下修改Mysql的用户(root)的密码
  2. SP34096 DIVCNTK - Counting Divisors (general)(Min_25筛)
  3. Mozilla 发布新 Firefox 用户信息反跟踪策略
  4. 超好用的webssh(支持秘钥登录)
  5. SES2 LED控制
  6. Mac OS X上安装配置apache服务器
  7. Hibernate关联关系映射-----单向一对一映射配置
  8. ASP.NET抓取网页内容
  9. linux awk浅析(转)
  10. ghost后自动修改IP和计算机名的VBS脚本