首页 > 代码库 > 树状结构

树状结构

2024-08-28 13:06:02   217人阅读

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="http://www.mamicode.com/easy/themes/default/easyui.css" />
		<link rel="stylesheet" href="http://www.mamicode.com/easy/themes/icon.css" />
		<script type="text/javascript" src="http://www.mamicode.com/easy/jquery.min.js" ></script>
		<script type="text/javascript" src="http://www.mamicode.com/easy/jquery.easyui.min.js" ></script>
	</head>
	<body>
		<a href="javascript:;" class="easyui-linkbutton" id="append">追加</a>
		<ul id="ul" class="easyui-tree" url="tree.php" checkbox="true" onlyLeafCheck="true" lines="true" dnd="true">
			<!--<li>
				<span>子节点1</span>
				<ul>
					<li><span>子节点的子节点</span>
						<ul>
							<li>节点</li>
							<li>节点</li>
							<li>节点</li>
							<li>节点</li>
						</ul>
						<ul>
							<li>
                                                          <ul>
							<li>节点</li>
							<li>节点</li>
							<li>节点</li>
							<li>节点</li>
						</ul>
                                        </li><span>子节点的子节点</span></li>
					<li><span>子节点的子节点</span></li>
				</ul>
			</li>
			<li>子节点2</li>
			<li>子节点3</li>
		</ul>-->
		<script>
			$(function(){
				$("#append").click(function(){
					var li = $("#ul").tree("getSelected");
					if(li) {
						//追加
						$("#ul").tree("append",{
							parent:li.target,
							data:[
								{
									id:11,
									text:"节点11",
								},
								{
									id:12,
									text:"节点12",
								},
							],
						});
					}
				});
			})
		</script>
	</body>
</html>

　　

<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><link rel="stylesheet" href="http://www.mamicode.com/easy/themes/default/easyui.css" /><link rel="stylesheet" href="http://www.mamicode.com/easy/themes/icon.css" /><script type="text/javascript" src="http://www.mamicode.com/easy/jquery.min.js" ></script><script type="text/javascript" src="http://www.mamicode.com/easy/jquery.easyui.min.js" ></script></head><body><a href="javascript:;" class="easyui-linkbutton" id="append">追加</a><ul id="ul" class="easyui-tree" url="tree.php" checkbox="true" onlyLeafCheck="true" lines="true" dnd="true"><!--<li><span>子节点1</span><ul><li><span>子节点的子节点</span><ul><li>节点</li><li>节点</li><li>节点</li><li>节点</li></ul></li><li><span>子节点的子节点</span></li><li><span>子节点的子节点</span></li></ul></li><li>子节点2</li><li>子节点3</li></ul>--><script>$(function(){$("#append").click(function(){var li = $("#ul").tree("getSelected");if(li) {//追加$("#ul").tree("append",{parent:li.target,data:[{id:11,text:"节点11",},{id:12,text:"节点12",},],});}});})</script></body></html>

 

树状结构


联系
我们