Twitter Bootstrap TreeView插件

Question

有没有人知道twitter bootstrap中树视图的成熟插件？到目前为止我发现的大多数事情都是

a）不再维护

b）看起来丑陋/有毛刺

c）无法从html无序列表

初始化

d）不允许选择元素（节点或 leaf）。

基本上我需要这个来实现类似于文件浏览器的东西，但是对于电子商务产品目录。

提前致谢！

Answer 1

似乎我有点迟到了，但你可以查看我的基于jQuery插件的Twitter Bootstrap树视图。

富有想象力地命名为bootstrap-treeview.js !!!

它是版本1，只支持Bootstrap v3向上，但是......

• 它将被维护，
• 看起来比我见过的任何其他东西更接近引导程序的外观和感觉，
• 是数据驱动的，
• 高度可定制的外观和感觉，
• 具有带事件挂钩的可选节点

查看项目github page以获取完整文档，然后选择look here for a live demo。

Answer 2

查看FuelUX tree

var treeDataSource = new DataSource({
  data: [
    { name: 'Test Folder 1', type: 'folder', additionalParameters: { id: 'F1' } },
    { name: 'Test Folder 2', type: 'folder', additionalParameters: { id: 'F2' } },
    { name: 'Test Item 1', type: 'item', additionalParameters: { id: 'I1' } },
    { name: 'Test Item 2', type: 'item', additionalParameters: { id: 'I2' } },
    { name: 'Test Item 3', type: 'item', additionalParameters: { id: 'I3' } }
  ],
  delay: 400
});

$（'＃MyTree'）。tree（{dataSource：treeDataSource}）;

以下是数据源的工作示例： http://bootply.com/60761

如果您想要选择文件夹或项目，则需要查看控件公开的方法/事件。