给bootstrap-treeview增加点击事件，单击菜单也能展开和折叠

原创于 2016-03-04 22:47:08 发布 · 3.2w 阅读

12 ·

CC 4.0 BY-SA版权

bootstrap 专栏收录该内容

13 篇文章

订阅专栏

本文详细介绍了如何在BootstrapTreeView插件中为列表项添加点击事件，使其能够展开或折叠子节点。通过修改源码并实现onClick方法，实现了列表交互功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

希望给Bootstrap treeView插件点击列表也能展开子节点，所以对li元素增加了onClick方法。

(一)首先修改bootstrap-treeview.js源码，找到<li class="list-group-item"></li>，增加onClick方法，修改后代码<li class="list-group-item" onclick="itemOnclick(this)"></li>。

(二)实现 onClick方法

function itemOnclick(target){
	//找到当前节点id
	var nodeid = $(target).attr('data-nodeid');
	var tree = $('#tree');
	//获取当前节点对象
	var node = tree.treeview('getNode', nodeid);
	
	if(node.state.expanded){ 
	    //处于展开状态则折叠
	    tree.treeview('collapseNode', node.nodeId);  
	} else {
	    //展开
	    tree.treeview('expandNode', node.nodeId);
	}
}