jQuery TreeGrid

来源:CSDN博客 | 时间:2014-03-28 14:25:56 | 阅读数:

[导读] 为避免重复造轮子,今天简单看了下将jQuery的TreeGrid,现在将其记录如下,希望能够对大家有所帮助。插件下载地址:http: plugins jquery com treegrid TreeGrid特点在HTML页面中的table元素中创建TreeGrid简单

为避免重复造轮子,今天简单看了下将jQuery的TreeGrid,现在将其记录如下,希望能够对大家有所帮助。

插件下载地址:http://plugins.jquery.com/treegrid/

TreeGrid特点

在HTML页面中的table元素中创建TreeGrid

简单灵活的javascript实现

兼容bootstrap2和3

能够保存树的状态

TreeGrid用法

第一步:初始化插件

 

[javascript] view plaincopy在CODE上查看代码片派生到我的代码片

<script type="text/javascript" src="js/jquery.js"></script>  
<script type="text/javascript" src="js/jquery.treegrid.js"></script>  
<link rel="stylesheet" href="css/jquery.treegrid.css">  
  
<script type="text/javascript">  
  $('.tree').treegrid();  
</script>  

 

第二步:创建表

 

 

[html] view plaincopy在CODE上查看代码片派生到我的代码片

<table class="tree">  
    <tr class="treegrid-1">  
        <td>Root node</td><td>Additional info</td>  
    </tr>  
    <tr class="treegrid-2 treegrid-parent-1">  
        <td>Node 1-1</td><td>Additional info</td>  
    </tr>  
    <tr class="treegrid-3 treegrid-parent-1">  
        <td>Node 1-2</td><td>Additional info</td>  
    </tr>  
    <tr class="treegrid-4 treegrid-parent-3">  
        <td>Node 1-2-1</td><td>Additional info</td>  
    </tr>  
</table>  

手机扫描下方二维码,关注php100官方微信。

同步官网每日更新,为您带来随时随地的资讯与技术信息。
更有不定期的互动抽奖活动,赢取实用贴心的小礼物。

除非特别声明,PHP100新闻均为原创或投稿报道,转载请注明作者及原文链接
原文地址:

延伸阅读 More

粤ICP备15117877号-3