树状菜单
点击 + 可控制菜单的折叠与展开,如果当前节点无链接且有子项,当前节点的href="#none",即点击当前a标签也可控制菜单的折叠与展开
<div class="menu_tree col-lg-3"> <ul> <li><i class="fa fa-plus-square"></i><a href="#1"><i class="fa fa-folder"></i>父节点· 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#2"><i class="fa fa-folder"></i>父节点· 2</a></li> <li> <i class="fa fa-plus-square"></i><a href="#3"><i class="fa fa-folder"></i>父节点· 3</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 2</a></li> <li><i class="fa fa-plus-square"></i><a href="#none"><i class="fa fa-folder"></i>子节点 · 3</a></li> <li> <i class="fa fa-plus-square"></i><a href="#none"><i class="fa fa-folder"></i>子节点 · 4</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 2</a></li> <li> <i class="fa fa-plus-square"></i><a href="#" title="子节点· 3"><i class="fa fa-folder"></i>子节点· 3</a> </li> </ul> </li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>父节点· 5</a> </li> </ul> </li> <li> <i class="fa fa-plus-square"></i><a href="#none"><i class="fa fa-folder"></i>父节点· 4</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 2</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 3</a></li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 4</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 2</a></li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 3</a> </li> </ul> </li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>父节点· 5</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 2</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 3</a></li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点 · 4</a> <ul> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 1</a></li> <li><i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 2</a></li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>子节点· 3</a> </li> </ul> </li> <li> <i class="fa fa-plus-square"></i><a href="#"><i class="fa fa-folder"></i>父节点· 5</a> </li> </ul> </li> </ul> </li> </ul> </div>