<table> <thead> <tr> <th>列1</th> <th>列2</th> <th>列3</th> </tr> </thead> <tbody id="tree1"> <tr> <td>行1:列1</td> <td>行1:列2</td> <td>行1:列3</td> </tr> <tr> <td>行2:列1</td> <td>行2:列2</td> <td>行2:列3</td> </tr> <tr> <td>行3:列1</td> <td>行3:列2</td> <td>行3:列3</td> </tr> <tr> <td>行4:列1</td> <td>行4:列2</td> <td>行4:列3</td> </tr> <tr> <td>行5:列1</td> <td>行5:列2</td> <td>行5:列3</td> </tr> </tbody> </table>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" src="jqtreetable.js"></script> <link rel="stylesheet" type="text/css" href="jqtreetable.css" /><script type="text/javascript"> $(function(){ //mapパラメータ:[] var map = [0, 1, 2, 1, 1]; var options = {openImg: "images/tv-collapsable.gif", shutImg: "images/tv-expandable.gif", leafImg: "images/tv-item.gif", lastOpenImg: "images/tv-collapsable-last.gif", lastShutImg: "images/tv-expandable-last.gif", lastLeafImg: "images/tv-item-last.gif", vertLineImg: "images/vertline.gif", blankImg: "images/blank.gif", collapse: true, column: 1, striped: false, highlight: true, onselect: function(target){}}; $("#tree1").jqTreeTable(map, options); }); </script>