<html>
<head>
<meta charset="utf-8">
<title>jQuery Treeview 插件 - 异步树</title>
<link rel="stylesheet" href="http://jquery.bassistance.de/treeview/jquery.treeview.css">
<link rel="stylesheet" href="http://jquery.bassistance.de/treeview/demo/screen.css">
<script src="http://jquery.bassistance.de/treeview/lib/jquery.js" type="text/javascript"></script>
<script src="http://jquery.bassistance.de/treeview/lib/jquery.cookie.js" type="text/javascript"></script>
<script src="http://jquery.bassistance.de/treeview/jquery.treeview.js" type="text/javascript"></script>
<script src="http://jquery.bassistance.de/treeview/jquery.treeview.edit.js" type="text/javascript"></script>
<script src="http://jquery.bassistance.de/treeview/jquery.treeview.async.js" type="text/javascript"></script>
<script type="text/javascript">
function initTrees() {
$("#black").treeview({
url: "http://jquery.bassistance.de/treeview/demo/source.php"
})
$("#mixed").treeview({
url: "http://jquery.bassistance.de/treeview/demo/source.php",
// 添加一些额外的、动态的数据,并通过 POST 请求
ajax: {
data: {
"additional": function() {
return "yeah: " + new Date;
}
},
type: "post"
}
});
}
$(document).ready(function(){
initTrees();
$("#refresh").click(function() {
$("#black").empty();
$("#mixed").empty();
initTrees();
});
});
</script>
</head>
<body>
<h1 id="banner">jQuery Treeview 插件 - 异步树</h1>
<div id="main">
<h4>延迟加载树</h4>
<ul id="black">
</ul>
<h4>预加载+延迟加载</h4>
<ul id="mixed">
<li><span>Item 1</span>
<ul>
<li><span>Item 1.0</span>
<ul>
<li><span>Item 1.0.0</span></li>
</ul>
</li>
<li><span>Item 1.1</span></li>
</ul>
</li>
<li id="36" class="hasChildren">
<span>Item 2</span>
<ul>
<li><span class="placeholder"> </span></li>
</ul>
</li>
<li>
<span>Item 3</span>
</li>
</ul>
<button id="refresh">刷新两棵树</button>
</div>
</body></html>