このサンプルは、jQueryのtreeView()プラグインを利用してフォルダーツリーを表示します。フォルダのノードを展開するとファイルのノードが展開されます。フォルダを開くとフォルダのイメージが変わります。[Add!]ボタンをクリックすると新規フォルダとアイテムを追加します。
このサンプルで使用しているイメージは、
ここ
からダウンロードしてください。
$(function() {
$("#browser").treeview();
$("#add").click(function() {
var branches = $("<li><span class='folder'>New Sublist</span><ul>" +
"<li><span class='file'>Item1</span></li>" +
"<li><span class='file'>Item2</span></li>" +
"</ul></li>").appendTo("#browser");
$("#browser").treeview({
add: branches
});
});
});