simple.html

来自「通过jquery组件实现各种各样的树形菜单」· HTML 代码 · 共 82 行

HTML
82 行
字号 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
	<title>jQuery treeView</title>
	
	<link rel="stylesheet" href="../jquery.treeview.css" />    <link rel="stylesheet" href="../red-treeview.css" />	<link rel="stylesheet" href="screen.css" />		<script src="../lib/jquery.js" type="text/javascript"></script>	<script src="../lib/jquery.cookie.js" type="text/javascript"></script>	<script src="../jquery.treeview.js" type="text/javascript"></script>	
	<script type="text/javascript">
	$(document).ready(function(){
		$("#browser").treeview({
			toggle: function() {
				console.log("%s was toggled.", $(this).find(">span").text());
			}
		});
		
		$("#add").click(function() {
			var branches = $("<li><span class='folder'>New Sublist</span><ul>" + 
				"<li><span class='file'>Item1</span></li>" + 
				"<li><span class='file'>Item2</span></li></ul></li>").appendTo("#browser");
			$("#browser").treeview({
				add: branches
			});
		});
	});
	</script>
	</head>
	<body>
	
	<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-treeview/">jQuery Treeview Plugin</a> Demo</h1>
	<div id="main">		<a href=".">Main Demo</a>
		
	<ul id="browser" class="filetree treeview-famfamfam">
		<li><span class="folder">Folder 1</span>
			<ul>
				<li><span class="folder">Item 1.1</span>					<ul>						<li><span class="file">Item 1.1.1</span></li>					</ul>				</li>				<li><span class="folder">Folder 2</span>					<ul>						<li><span class="folder">Subfolder 2.1</span>							<ul id="folder21">								<li><span class="file">File 2.1.1</span></li>								<li><span class="file">File 2.1.2</span></li>							</ul>						</li>						<li><span class="folder">Subfolder 2.2</span>							<ul>								<li><span class="file">File 2.2.1</span></li>								<li><span class="file">File 2.2.2</span></li>							</ul>						</li>					</ul>				</li>				<li class="closed"><span class="folder">Folder 3 (closed at start)</span>					<ul>						<li><span class="file">File 3.1</span></li>					</ul>				</li>				<li><span class="file">File 4</span></li>
			</ul>
		</li>
	</ul>
	
	<button id="add">Add!</button>
	
	<p>+/- Icons from <a href="http://www.famfamfam.com/lab/icons/">famfamfam</a></p>
	
</div>
 
</body></html>

simple.html - 源码说明

本页面展示了「通过jquery组件实现各种各样的树形菜单」中的 simple.html 源码文件，采用 HTML 编程语言编写，共 82 行代码。您可以在线阅读完整代码内容，也可以返回资源详情页下载完整源码包进行本地学习和开发。

虫虫下载站收录了大量与jquery相关的技术资源，包括源代码、技术文档、电路图等，是电子工程师和嵌入式开发者的专业学习平台。

⌨️ 快捷键说明

复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?