|
马上注册,结交更多好友,享用更多功能^_^
您需要 登录 才可以下载或查看,没有账号?立即注册
x
本帖最后由 老宇不老 于 2013-10-26 22:26 编辑
导航栏制作。
代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Sample02_2LevelNav.aspx.cs" Inherits="Sample02_2LevelNav" %>
< !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 runat="server">
<title></title>
<script src="jquery-1.8.3.js" type="text/javascript"></script>
<script type ="text/javascript">
$(document).ready(function () {
$("a.m0").mouseenter(function () {
$(".smenu").hide();
$("+.smenu", this).fadeIn(200);
});
$("#div_menu").mouseleave(function () {
$(".smenu").fadeOut(200);
});
});
</script>
< style type ="text/css">
body{ margin:0px; padding:0px;}
#div_menu { border:1px solid silver;
background-image:url(imgs/back_head.jpg);
background-repeat:repeat-x;
}
a{ display:block; text-decoration:none; color:Gray;}
a:hover{ color:#930;}
a.m0{ margin:10px 0px 10px 0px; padding:0px 10px 0px 10px;}
a.m1{ padding:10px 25px 10px 25px; font-size:12px;}
a.m1 +a.m1 { border-top:1px dashed silver;}
.menuset { float:left;
}
.menuset+.menuset a.m0
{ border-left:1px solid silver;}
.smenu { position:absolute;
border:1px solid silver;
border-top:none;
background-color:RGB(251,251,251);
display:none; }
< /style>
< /head>
< body>
<form id="form1" runat="server">
<div>
<div id="div_menu" runat="server">
</div>
</div>
</form>
< /body>
< /html>
-------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.OleDb;
public partial class Sample02_2LevelNav : System.Web.UI.Page
{ string str_cnn = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=";
string str_sourcefile = "mdb\\mydb.mdb";
OleDbConnection cnn;
OleDbCommand cmd;
OleDbDataReader datar;
string str_sql;
protected void Page_Load(object sender, EventArgs e)
{
//载入二级导航菜单
makenav();
}
protected void makenav() {
string str_conn = str_cnn + MapPath(str_sourcefile);
cnn = new OleDbConnection(str_conn);
cnn.Open();
str_sql = "SELECT t_menuL0.*, t_menuL1.* FROM t_menuL1 RIGHT JOIN t_menuL0 ON t_menuL1.m1_m0id = t_menuL0.m0_id";
cmd = new OleDbCommand(str_sql, cnn);
datar = cmd.ExecuteReader();
Panel pnl_menuset, pnl_submenu;
HyperLink a_m0, a_m1;
while (datar.Read()) {
pnl_menuset = (Panel)div_menu.FindControl("div_menuset_" + datar["m0_id"].ToString());
if (pnl_menuset == null) {
pnl_menuset = new Panel(); pnl_menuset.CssClass = "menuset";
pnl_menuset.ID = "div_menuset_" + datar["m0_id"].ToString();
div_menu.Controls.Add(pnl_menuset);
}
pnl_menuset = (Panel)div_menu.FindControl("div_menuset_" + datar["m0_id"].ToString());
a_m0 = (HyperLink)div_menu.FindControl("a_m0_" + datar["m0_id"].ToString());
if (a_m0 == null) {
a_m0 = new HyperLink(); a_m0.CssClass = "m0";
a_m0.ID = "a_m0_" + datar["m0_id"].ToString();
a_m0.Text = datar["m0_ttl"].ToString();
a_m0.NavigateUrl = datar["m0_url"].ToString();
pnl_menuset.Controls.Add(a_m0);
}
if (!(datar["m1_ttl"] is DBNull)) {
pnl_submenu = (Panel)div_menu.FindControl("div_smenu_" + datar["m0_id"].ToString());
if (pnl_submenu == null) {
pnl_submenu = new Panel(); pnl_submenu.CssClass = "smenu";
pnl_submenu.ID = "div_smenu_" + datar["m0_id"].ToString();
pnl_menuset.Controls.Add(pnl_submenu);
}
pnl_submenu = (Panel)div_menu.FindControl("div_smenu_" + datar["m0_id"].ToString());
a_m1 = new HyperLink(); a_m1.CssClass = "m1";
a_m1.ID = "a_m1_" + datar["m1_id"].ToString();
a_m1.Text = datar["m1_ttl"].ToString();
a_m1.NavigateUrl = datar["m1_url"].ToString();
pnl_submenu.Controls.Add(a_m1);
}
}
cnn.Close();
Panel p = new Panel();
p.Style.Add("clear", "both");
div_menu.Controls.Add(p);
}
}
想知道红色的两行代码的作用。
貌似将其注释掉了也不会有问题啊~~~
sprite 发表于 2013-10-26 22:23
红色代码部分只是做 获取id为"div_menu"的div对象中寻找panel对象而已。
话说同学你可以把代码稍微做一下优化。。ado访问可以封装公共类起来。以免多次用到(最好能写成读配置多数据扩展等)。后台的代码是运行在服务端的不要给服务器压力太大哦。因此后台不要写太多不必要的逻辑处理。后台可以做获取数据也可以做一些二次验证等,前端可以根据getJSON AJAX GET POST LOAD等方法获取加载数据最后写脚本或算法来实现想要的功能哈。
|
|