动态生成菜单怎么弄啊??

xhh_net 2009-12-15 10:44:16
我想实现这样的

我数据库中有两个表 一个分类表,一个分类下的成员表
type表
ID Name
1 网站开发
2 数据库

data表
ID Name TypeID
1 前台 1
2 后台 1
3 sql2005 2
4 sql2000 2

在前台页面要动态生成菜单,想下面这样的效果
1.首先是生成分类
网站开发
数据库

2.点网站开发后
网站开发
前台
后台
数据库

3.点数据库后 网站开发折叠
网站开发
数据库
sql2005
sql2000



怎样用 ajax/jquery实现啊!

我有个思路 ,就是先获得分类信息,当点击某个分类信息后,然后通过ajax去获得该分类信息下的数据,然后再通过css+javascrpt来控制他们。但代码不知道怎么写??

...全文
135 9 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
exiori 2009-12-17
  • 打赏
  • 举报
回复
没有效果JS代码不对吧。
xhh_net 2009-12-17
  • 打赏
  • 举报
回复

//AJAX读取所有数据
function AjaxLoadAll(id, url) {
$("#" + id).html("请稍等,正在加载……");
$.ajax({
type: "POST",
url: url,
async: false,
success: function(data) {
$("#" + id).html(data);
}
});
刚改好,就是不让ajax异步运行。完全接受后台拼出的菜单后就可以了。
我想过程是这样的吧!第一步:页面加载。 第二步:执行 AjaxInfo("navigation","test.aspx")从后台获得数据。如果是异步的话,在数据没有接受完全时,可能会执行 $("h3").click(function() {
$(this).next(".menu").slideToggle("slow");
$(this).siblings("h3").next(".menu").hide("slow");
});
这个事件,但我们的数据不完全,这个事件不能被正确初始化。即使最后数据得到完全,但也不能正确显示效果。 所以我该成同步后,就可以了。

也不知道是不是这个原因
chenyunkun2008 2009-12-16
  • 打赏
  • 举报
回复
现在也在学习这个,共同进步吧
xuefeng_zzg 2009-12-16
  • 打赏
  • 举报
回复
用TreeView
Lovely_baby 2009-12-16
  • 打赏
  • 举报
回复
看了一下你的需求
TreeView是完全能实现的~~

不知道你使用ajax/jquery有什么意义
wanghao3616 2009-12-16
  • 打赏
  • 举报
回复
ajax动态菜单 google一下
eleven~ 2009-12-16
  • 打赏
  • 举报
回复
用TreeView不是很好么。
xhh_net 2009-12-16
  • 打赏
  • 举报
回复

<head>
<title>无标题页</title>
<script type="text/javascript" language="javascript" src="JS/jquery-1.3.2.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {
$("h3").click(function() {
$(this).next(".menu").slideToggle("slow");
$(this).siblings("h3").next(".menu").hide("slow");
});
});
</script>
<style type="text/css">
h3
{
cursor: pointer; 如果是静态的页面测试可以实现菜单的这点展开
}
网站建设 网站建设
</style> 前台 数 据 库
</head> 后台 sql2005
<body> 数 据 库 sql2000
<div id="navigation">
<h3>网站建设</h3>
<ul class="menu">
<li><a href="#">前台</a></li>
<li><a href="#">后台</a></li>
</ul>
<h3>数据库</h3>
<ul class="menu">
<li><a href="#">sql2005</a></li>
<li><a href="#">sql2000</a></li>
</ul>

</div>
</body>
</html>


后来我想用ajax+jquery实现

<head>
<title>无标题页</title>
<script type="text/javascript" language="javascript" src="JS/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
//详情
function AjaxInfo(id, url) {
AjaxLoadAll(id, url);
}

//AJAX读取所有数据
function AjaxLoadAll(id, url) {
$("#" + id).html("请稍等,正在加载……");
$.ajax({
type: "POST",
url: url,
success: function(data) {
$("#" + id).html(data);
}
});
}
$(document).ready(function() {
AjaxInfo("navigation","test.aspx");
$("h3").click(function() {
$(this).next(".menu").slideToggle("slow");
$(this).siblings("h3").next(".menu").hide("slow");
});
});
</script>
<style type="text/css">
h3
{
cursor: pointer;
}

</style>
</head>
<body>
<div id="navigation">
</div>
</body>
</html>


test.aspx页面代码

string connectStr = @"server=.;database=Menum;uid=sa;pwd=123";
protected void Page_Load(object sender, EventArgs e)
{
BindMenum();
}

protected void BindMenum() 我数据库有两个表
{ Type表 data表
StringBuilder str = new StringBuilder(); ID Name ID Name TypeID
SqlDataReader sdr = BindType();
while (sdr.Read())
{
str.Append("<h3>");
str.Append(sdr["Name"]);
str.Append("</h3>");
DataTable dt = BindTypeData(sdr["ID"].ToString());
str.Append("<ul class=\"menu\" >");
foreach (DataRowView dr in dt.DefaultView)
{
str.Append("<li><a href=\"#\">");
str.Append(dr["Name"]);
str.Append("</a></li>");
}
str.Append("</ul>");
}
sdr.Close();
Response.Write(str.ToString());

}


结果是: 结果显示正常,但是却不能应用“菜单效果”;
对juqery刚看两天!不知道那个地方出错了.

xhh_net 2009-12-16
  • 打赏
  • 举报
回复
treeView我会弄!想学习学习 ajax。一同进步

62,243

社区成员

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

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