可增加删除编辑的组织结构图
一款可增加、删除、编辑的组织结构图,类似于树形结构,点击每个组织成员,可以在输入框内输入内容然后点击增加即可修改内容,如果不输人内容直接点击增加,则在此成员下添加新的分支,适合做公司的组织结构图等等,喜欢的童鞋请收下吧。
源码介绍
页面的head部分,先引入两个CSS样式文件,然后设置好页面部分元素的样式,代码如下:
type="text/css" rel="stylesheet" href="css/jquery.jorgchart.css"/>
type="text/css" rel="stylesheet" href="css/custom.css"/>
接着引入jQuery库和两个JS文件,并设置好结构交互的事件响应,代码如下:
页面的body部分,分为3个部分:最上面的一个div时点击编辑时的交互,中间的ul是页面初始的组织结构数据,最下面的div是显示数据生成table后的容器,代码如下:
class="add">
class="newAdd">增加
class="newDel">删除
style="padding-left: 30px;color: black "> 输入框空时增加块,有内容时修改当前块值
id="org" style="display:none">
- >
来自星星的你
>
- id="beer">都敏俊
>
- >古代千颂伊
- >张英牧
- >千颂伊
>
- >李辉京
- >刘世美
id="chart" class="orgChart" >
声明:
素材码,一个精品商业网站源码分享的个人网站 www.phprr.com
1. 本站所有资源来源于网络,均不允许转载,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 如发现会员恶意传播或用于违法用途,本站有权封禁账号,并积极配合有关部门调查
4. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
5. 本站提供的源码、模板、插件等等其他资源(除商业源码分类),都不包含技术服务请大家谅解!
6. 如有链接无法下载、失效或广告,请联系管理员处理!
7. 本站资源售价和会员费只是赞助,收取费用仅维持本站的日常运营所需!
8. 如遇到加密压缩包,默认解压密码为"www.phprr.com",如遇到无法解压的请联系管理员!
9.本站客服QQ:357058607
10.如您发现本站分享的源码,侵犯了您的权益,请联系:357058607#qq.com (将#换成@)
素材码,一个精品商业网站源码分享的个人网站 www.phprr.com
1. 本站所有资源来源于网络,均不允许转载,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 如发现会员恶意传播或用于违法用途,本站有权封禁账号,并积极配合有关部门调查
4. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
5. 本站提供的源码、模板、插件等等其他资源(除商业源码分类),都不包含技术服务请大家谅解!
6. 如有链接无法下载、失效或广告,请联系管理员处理!
7. 本站资源售价和会员费只是赞助,收取费用仅维持本站的日常运营所需!
8. 如遇到加密压缩包,默认解压密码为"www.phprr.com",如遇到无法解压的请联系管理员!
9.本站客服QQ:357058607
10.如您发现本站分享的源码,侵犯了您的权益,请联系:357058607#qq.com (将#换成@)
警告!
(1)本站禁止一切违法行为的用户,一经发现永久封号,且不予退款。(2)本站源码仅供参考和钻研,如有技术,部分源码可利用于二次开发。