如何使用jquery.treeview.js控件，显示树形菜单？？？

y11111494 2010-08-13 09:20:31
如何使用jquery.treeview.js控件，显示树形菜单？？
...全文
681 9 打赏 收藏 转发到动态 举报
写回复
用AI写文章
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
whr214120886 2012-06-01
  • 打赏
  • 举报
 回复
dfdd
Gambler 2011-07-27
  • 打赏
  • 举报
 回复
<!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=gb2312" />
<title>书籍评价搜索系统</title>
<!--<link rel="stylesheet" href="css/jquery.treeview.css" type="text/css" />
-->

<link rel="stylesheet" href="jquery.tree.css" type="text/css" />
<link rel="stylesheet" href="css/screen.css" type="text/css"/>
<link rel="stylesheet" href="css/window.css" type="text/css" />
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.cookie.js" type="text/javascript"></script>
<!--<script src="js/jquery.treeview.js" type="text/javascript"></script>
<script src="js/jquery.treeview.edit.js" type="text/javascript"></script>
<script src="js/jquery.treeview.async.js" type="text/javascript"></script>
-->

<script src="js/jquery.tree.js" type="text/javascript"></script>
<!--<script src="js/window.js" type="text/javascript"></script>
-->

<!--<script src="js/tree1.js" type="text/javascript"></script>
--><script type="text/javascript">
$(document).ready(function(){
var o={
url:"sendNode",
onnodeclick:function(){
alert($(this).attr("title"));
}
};
//o.data=treedata;
$.ajax({
url: o.url,
type: "POST",
// async: false,
data: {
id: "0"
},
success: function(treedata){
o.data = treedata;
$("#top2").treeview(o);
}
});

});


</script>

</head>

<body>
<div id="main">
<div id="left">
<div id="top">
<div id="top1">
<form>
<label><span class="STYLE1">请输入：</span></label>
<input type="text" id="name" style="width:300px; font-style:inherit; margin-top:25px; " value="http://www.baidu.com.cn/" />
<input type="button" id="submit" value="提交" />
</form>
</div>
<div id="top2">

</div>
<div id="top3">
<!-- <h4>树形折叠</h4>
<ul id="browser" class="filetree">
<li><span class="folder">html </span>
<ul>
<li><span class="folder">head</span>
<ul>
<li><span class="file">title</span></li>
<li><span class="file"></span></li>
</ul>
</li>
<li><span class="file">/head</span></li>
<li><span class="folder"><body></span>
<ul id="folder21">
<li><span class="file"><p></p></span></li>
<li><span class="file"><p></p></span></li>
</ul>
</li>
<li><span class="file"></body></span></li>
</ul>
<li><span class="file">html></span></li>
</li>
</ul>-->
</div>
</div>
<div id="down">

</div>
</div>
<div id="right">
<div style="width:370px; height:380px; position:relative; border-bottom:ridge">
<table width="372" border="0">
<tr><td height="40px" colspan="2"></td></tr>
<tr><td height="160" colspan="2">
<table width="316" height="47" border="0">
<tr>
<td width="66" height="43">网址：</td>
<td width="240">
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="text" id="url" style="width:200px; font-style:inherit; margin-top:25px; " value="http://www.baidu.com.cn/"/>
</label>
</form></td>
</tr>
</table>
</td>
<td><input name="submit" id="ok" type="button" value="提交" /></td>
</tr>
<tr><td width="74" height="36">
匹配准则：
</td>
<td width="217">
<select id="select" style="width:200px; height:30px;">
</select></td>
<td><form id="form2" name="form2" method="post" action="">
<input type="button"id="choose" value="确定" />
</form></td>
</tr>
<tr><td height="38" colspan="2"><input id="context" name="context" type="text" style="width:300px; height:30px;" /></td>
<td><input id="sure" name="button" type="button" value="确定" /></td>
</tr>
<tr>
<td colspan="2"></td>
<td width="67"></td>
</tr>
</table>

</div>
<div style="width:370px; height:400px; border-top:ridge">
<iframe align="middle" src="" width="380px" height="399px"></iframe>
</div>
</div>
</div>
</body>
</html>
y11111494 2010-08-13
  • 打赏
  • 举报
 回复
当使用一个陌生控件时，如何入手呢？
y11111494 2010-08-13
  • 打赏
  • 举报
 回复
http://94this.com.cn/article/288.htm
y11111494 2010-08-13
  • 打赏
  • 举报
 回复 


<html>

	<head>

		<%@ include file="/WEB-INF/pages/public/commons.jspf"%>

		<script type="text/javascript" src="${basePath }/widgets/jquery.treeview/lib/jquery.cookie.js"></script>

		<script type="text/javascript" src="${basePath }/widgets/jquery.treeview/jquery.treeview.js"></script>

		<link rel="stylesheet" href="${basePath }/widgets/jquery.treeview/jquery.treeview.css" />

		

		<script type="text/javascript">

			function doLogout(){

				var url = '<html:rewrite action="/user.do?method=logout"/>';

				if(window.confirm("您确定要注销吗？")){

					window.parent.location.href = url;

				}

			}	

			$(".menu").treeview({

				persist: "location",

				collapsed: true,

				unique: true

			});

		</script>

	</head>



	<body style="margin: 10px; font-size: 14px;">

		<ul class="menu treeview-famfamfam" style="list-style: disc;">

			<li><a href="javascript:doLogout()">注销 [${sessionScope["SESSION_LOGGED_ON_USER"].nickname}]</a></li>

			<li><html:link target="_parent" action='/portal?method=index'>论坛首页</html:link></li>

			<li>---------------</li>

			<li><html:link target="right" action='/manage/category?method=list'>版面管理</html:link></li>

			<li><html:link target="right" action='/manage/role?method=list'>角色管理</html:link></li>

			<li><html:link target="right" action='/manage/user?method=list'>会员管理</html:link></li>

			<li><html:link target="right" action='/manage/topicSearch?method=list'>主题搜索管理</html:link></li>

			<li><html:link target="right" action='/manage/blogLink?method=list'>博客链接管理</html:link></li>

			<li><a href='#'>系统设置</a></li>

		</ul>

	</body>

</html>

我的页面中，jquery.treeview没有起到作用？？
sAS112UUUYY111 2010-08-13
  • 打赏
  • 举报
 回复
[Quote=引用 4 楼 wula0010 的回复:]
看demo....................
[/Quote]

有用
y11111494 2010-08-13
  • 打赏
  • 举报
 回复
应该有一些介绍最好
wula0010 2010-08-13
  • 打赏
  • 举报
 回复
看demo....................
treeview.js树控件
treeview.js树控件 用于做树形菜单 欢迎下载！！1！！
bootstrap树形下拉框 下拉框树形菜单
bootstrap树控件使用bootstrap-treeview.js树形控件在下拉框select中显示，带树形的下拉框
SSM后台管理系统开发实战
Druid性能监控 Linux系统 Nginx反向代理 Ajax异步请求技术 Jquery基本使用 AdminLTE前端框架 Chart图表-线状图和饼状图 百度地图定位城市 BootStrap前端框架 BootStrap-Table插件 BootStrap-Treeview插件 Markdown...
Bootstrap树形菜单插件TreeView.js使用方法详解
主要为大家详细介绍了Bootstrap树形菜单插件TreeView.js使用方法,一款非常酷的基于bootstrap的jQuery多级列表树插件，具有一定的实用性，感兴趣的小伙伴们可以参考一下
jQuery treeview 树形菜单插件 v1.4
内容索引:脚本资源,jQuery,treeview,树形菜单　jQuery treeview 是一款来自jQuery的树形菜单插件，支持无限制扩展，支持动态添加菜单项，可以配合ASP/PHP/等动态语言完成漂亮的无刷新动态树状菜单，当前版本号 v1.4...
Java SE

62,616

社区成员

307,307

社区内容

发帖
与我相关
我的任务
社区描述
Java 2 Standard Edition
社区管理员
  • Java SE
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章