北京网帮你
bootstrap-treeview树插件使用2
时间:2016-02-01 02:24:47 浏览:1061
treeview方法列表
  • checkAll(options):选择所有的节点。

    $('#tree').treeview('checkAll', { silent: true});

    触发nodeChecked事件,传入silent来阻止其它事件。


  • checkNode(node | nodeId, options):选择指定的节点,接收节点或节点ID。

    $('#tree').treeview('checkNode', [ nodeId, { silent: true} ]);

    触发nodeChecked事件,传入silent来阻止其它事件。


  • clearSearch():清空以前的搜索结果。例如清除它们的高亮状态。

    $('#tree').treeview('clearSearch');

    触发searchCleared事件。


  • collapseAll(options):折叠所有的节点,折叠整个树。

    $('#tree').treeview('collapseAll', { silent: true});

    触发nodeCollapsed事件,传入silent来阻止其它事件。


  • collapseNode(node | nodeId, options):折叠指定节点和它的子节点。如果不想折叠子节点,可以设置{ ignoreChildren: true }

    $('#tree').treeview('collapseNode', [ nodeId, { silent: true, ignoreChildren: false} ]);

    触发nodeCollapsed事件,传入silent来阻止其它事件。


  • disableAll(options):禁用所有的节点。

    $('#tree').treeview('disableAll', { silent: true});

    触发nodeDisabled事件,传入silent来阻止其它事件。


  • disableNode(node | nodeId, options):禁用指定的节点,接收节点或节点ID。

    $('#tree').treeview('disableNode', [ nodeId, { silent: true} ]);

    触发nodeDisabled事件,传入silent来阻止其它事件。


  • enableAll(options):启用所有的节点。

    $('#tree').treeview('enableAll', { silent: true});

    触发nodeEnabled事件,传入silent来阻止其它事件。


  • enableNode(node | nodeId, options):启用指定的节点,接收节点或节点ID。

    $('#tree').treeview('enableNode', [ nodeId, { silent: true} ]);

    触发nodeEnabled事件,传入silent来阻止其它事件。


  • expandAll(options):展开所有的树节点。也可以展开任何给定级别的树节点。

    $('#tree').treeview('expandAll', { levels: 2, silent: true});

    触发nodeExpanded事件,传入silent来阻止其它事件。


  • expandNode(node | nodeId, options):展开指定的树节点,接收节点或节点ID。也可以展开任何给定级别的树节点。

    $('#tree').treeview('expandNode', [ nodeId, { levels: 2, silent: true} ]);

    触发nodeExpanded事件,传入silent来阻止其它事件。


  • getCollapsed():返回折叠节点的数组。例如state.expanded = false

    $('#tree').treeview('getCollapsed', nodeId);


  • getDisabled():返回被禁用节点的数组。

    $('#tree').treeview('getDisabled', nodeId);


  • getEnabled():返回可用节点的数组。

    $('#tree').treeview('getEnabled', nodeId);


  • getExpanded():返回所有展开节点的数组。

    $('#tree').treeview('getExpanded', nodeId);


  • getNode(nodeId):返回给定节点ID的单一节点对象。

    $('#tree').treeview('getNode', nodeId);


  • getParent(node | nodeId):返回给定节点的父节点,如果没有则返回undefined。

    $('#tree').treeview('getParent', node);


  • getSelected():返回所有被选择节点的数组,例如:state.selected = true

    $('#tree').treeview('getSelected', nodeId);


  • getSiblings(node | nodeId):返回给定节点的兄弟节点的数组,如果没有则返回undefined。

    $('#tree').treeview('getSiblings', node);


  • getUnselected():返回没有被选择节点的数组。例如:state.selected = false

    $('#tree').treeview('getUnselected', nodeId);


  • remove():移除列表树容器。移除附加的事件、附加对象和额外的html元素。

    $('#tree').treeview('remove');


  • revealNode(node | nodeId, options):显示一个树节点,展开从这个节点开始到根节点的所有节点。

    $('#tree').treeview('revealNode', [ nodeId, { silent: true} ]);

    触发nodeExpanded事件,传入silent来阻止其它事件。


  • search(pattern, options):搜索匹配是非常的指定树节点,并高亮它们。返回配平节点的数组。

    $('#tree').treeview('search', [ 'Parent', {
     ignoreCase: true,     // case insensitive
     exactMatch: false,    // like or equals
     revealResults: true,  // reveal matching nodes
    }]);

    触发searchComplete事件。


  • selectNode(node | nodeId, options):选择一个给定的树节点,接收节点或节点ID。

    $('#tree').treeview('selectNode', [ nodeId, { silent: true} ]);

    触发nodeSelected事件,传入silent来阻止其它事件。


  • toggleNodeChecked(node | nodeId, options):切换节点的Check状态。

    $('#tree').treeview('toggleNodeChecked', [ nodeId, { silent: true} ]);

    触发nodeChecked事件或nodeUnchecked事件,传入silent来阻止其它事件。


  • toggleNodeDisabled(node | nodeId, options):切换一个节点的可用和不可用状态。

    $('#tree').treeview('toggleNodeDisabled', [ nodeId, { silent: true} ]);

    触发nodeDisabled事件或nodeEnabled事件,传入silent来阻止其它事件。


  • toggleNodeExpanded(node | nodeId, options):切换一个节点的展开和折叠状态。

    $('#tree').treeview('toggleNodeExpanded', [ nodeId, { silent: true} ]);

    触发nodeExpanded事件或nodeCollapsed事件,传入silent来阻止其它事件。


  • toggleNodeSelected(node | nodeId, options):切换一个节点的选择状态。

    $('#tree').treeview('toggleNodeSelected', [ nodeId, { silent: true} ]);

    触发nodeSelected事件或nodeUnselected事件,传入silent来阻止其它事件。


  • uncheckAll(options):Uncheck所有的节点。

    $('#tree').treeview('uncheckAll', { silent: true});

    触发nodeUnchecked事件,传入silent来阻止其它事件。


  • uncheckNode(node | nodeId, options):Uncheck一个给定的节点,接收节点或节点ID。

    $('#tree').treeview('uncheckNode', [ nodeId, { silent: true} ]);

    触发nodeUnchecked事件,传入silent来阻止其它事件。


  • unselectNode(node | nodeId, options):不选择指定的节点,接收节点或节点ID。

    $('#tree').treeview('unselectNode', [ nodeId, { silent: true} ]);

    触发nodeUnselected事件,传入silent来阻止其它事件。


事件

你可以在参数中使用回调函数来绑定任何事件,或者使用标准的jQuery .on()方法来绑定事件。

在参数中调用的示例:

$('#tree').treeview({
 // The naming convention for callback's is to prepend with `on`
 // and capitalize the first letter of the event name
 // e.g. nodeSelected -> onNodeSelected
 onNodeSelected: function(event, data) {
   // 事件代码...
});                

使用jQuery .on方法:

$('#tree').on('nodeSelected', function(event, data) {
 // 事件代码...
});                
可用事件列表
  • nodeChecked (event, node):一个节点被checked。

  • nodeCollapsed (event, node):一个节点被折叠。

  • nodeDisabled (event, node):一个节点被禁用。

  • nodeEnabled (event, node):一个节点被启用。

  • nodeExpanded (event, node):一个节点被展开。

  • nodeSelected (event, node):一个节点被选择。

  • nodeUnchecked (event, node):一个节点被unchecked。

  • nodeUnselected (event, node):取消选择一个节点。

  • searchComplete (event, results):搜索完成之后触发。

  • searchCleared (event, results):搜索结果被清除之后触发。



[上一篇]bootstrap-treeview是一款效果非
[下一篇]Laravel 5 教程学习笔记Session::
Copyright 2022 © 93580.com.cn 网帮你

2022 © 版权所有 红花岗区网帮你信息技术工作室

工信部备案号:黔ICP备2024036985号-2

请使用网帮你微信扫码登录