zoukankan      html  css  js  c++  java
  • 一步一步教你做三级可折叠树形菜单。

    多谢大家帮我做测试

    演示例子

    [url=http://www.bvbuy.cn/bbss/index.htm]http://www.bvbuy.cn/bbss/index.htm[/url]

    所需js 和css 文件请到我的资源里下载

    第一步建表bbs_panel1  

    id panelName  panelMsg url  

    21  开发语言   xx       

    表bbs_panel2

    id pid panelName  panelInfo  panelSort url

    1   21   VC/MFC

    2   21    vb

    表bbs_panel3

    id pid ppid panelName  panelInfo  panelsort url

    1   1   21    基础类

    2   1   21    界面

    3   1   21    网络编程

    第二步嵌套REPEATER

    [code=HTML]

    <head runat="server">

        <title>treeleft</title>

        <link rel="stylesheet" href="js/jquery.treeview.css"/>

    <link rel="stylesheet" href="js/red-treeview.css"/>

    <link rel="stylesheet" href="js/screen.css"/>

    <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 type="text/javascript">

    $(function() {

    $("#tree").treeview({

    collapsed: true,

    animated: "medium",

    control:"#sidetreecontrol",

    persist: "location"

    });

    })

       $(document).ready(

                 function() 

                { 

                  delClass();

                 }); 

    function delClass()

    {

     var   lis   =   document.getElementsByTagName('li'); 

     var i;

     var length;

              for( i=0; i<length;i++)  

             { 

                    if(lis[i].getElementsByTagName('ul').length   ==   0)   

                    {

                      lis[i].setAttribute('class',''); 

                    }

              } 

            }

    </script>

    </head>

    <body>

    <div id="main"><a href="#"></a>

    <div id="sidetree">

    <div id="sidetreecontrol"><a href="#">Collapse All</a> | <a href="#">Expand All</a></div>

    <ul id="tree" class="treeview">

    <asp:Repeater ID="bClass" runat="server" OnItemDataBound="bClassList">

      <ItemTemplate>

            <li class="expandable"><div class="hitarea expandable-hitarea "></div><a href="Title.aspx?mode=1&id=<%#Eval("id") %>" target="main"><strong><%#Eval("MenuName")%></strong></a> 

              <ul style="display: none; "><asp:Repeater ID="bsClass" runat="server" OnItemDataBound="bsClassList"><ItemTemplate>

                <li class="expandable"> <a href="Title.aspx?mode=2&id=<%#Eval("pid") %>&pid=<%#Eval("id") %>" target="main"><%#Eval("MenuName")%></a>

                     <ul style="display: none; "> <asp:Repeater ID="sClass" runat="server"><ItemTemplate><li ><a href="Title.aspx?mode=3&id=<%#Eval("ppid") %>&pid=<%#Eval("pid") %>&ppid=<%#Eval("id") %>" target="main"><%#Eval("MenuName")%></a> </li>

                        </ItemTemplate> </asp:Repeater>

                     </ul>   

                 </li> 

                    </ItemTemplate></asp:Repeater>

                </ul>

              </li>

          </ItemTemplate>

        </asp:Repeater>

     </ul>

    <br style="clear: left" />

    </div>

    </div>

    </body>

    [/CODE]

    第三步 后台

    [code=C#]

    private string strbbsType = "2";

        private string sql = "";

        protected void Page_Load(object sender, EventArgs e)

        {

             if (Request.QueryString["bbsType"]!=null)

             { 

                strbbsType = Request.QueryString["bbsType"].ToString();

             }

            if (!IsPostBack)

            {

                if (strbbsType=="1")

                {

                sql = "select id,MenuName,url  from M_MenuHead  where id>0 order by id";

                }

                else

                {

                    sql = "select  id,panelName as MenuName,url  from bbs_panel1  ";

                }

                DataSet rd = new DataSet();

                rd = SqlHelper.ExecuteDataset(SqlHelper.Conn2, CommandType.Text, sql);

                bClass.DataSource = rd;

                bClass.DataBind();

            }

        }

        protected void bClassList(object sender, RepeaterItemEventArgs e)

        {

            if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)

            {

                string preid = ((DataRowView)e.Item.DataItem).Row["id"].ToString();//获得对应ID

                Repeater bsClass = (Repeater)e.Item.FindControl("bsClass");//找到要绑定数据的Repeater

                if (bsClass != null)

                {

                    if (strbbsType == "1")

                    {

                        sql = "select id,pid,MenuName from M_MenuChildren where pid=" + preid + " ";

                    }

                    else

                    {

                        sql = "select  id,pid,panelName as MenuName  from bbs_panel2 where pid=" + preid + " ";

                    }

                    DataSet srd = new DataSet();

                    srd = SqlHelper.ExecuteDataset(SqlHelper.Conn2, CommandType.Text, sql);

                    bsClass.DataSource = srd;

                    bsClass.DataBind();

                }

            }

        }

        protected void bsClassList(object sender, RepeaterItemEventArgs e)

        {

            if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)

            {

                string preid = ((DataRowView)e.Item.DataItem).Row["id"].ToString();//获得对应ID

                Repeater sClass = (Repeater)e.Item.FindControl("sClass");//找到要绑定数据的Repeater

                if (sClass != null)

                {if (strbbsType=="1")

                {

                    sql = "select id,pid,ppid,MenuName from M_MenuChildren2 where pid=" + preid + " ";

                }

                    else

                {

                    sql = "select id,pid,ppid,panelName as MenuName  from bbs_panel3 where pid=" + preid + " ";

                }

                    DataSet srd = new DataSet();

                    srd = SqlHelper.ExecuteDataset(SqlHelper.Conn2, CommandType.Text, sql);

    //SqlHelper.Conn2是数据库连接字符

                    sClass.DataSource = srd;

                    sClass.DataBind();

                }

            }

        }

    [/code]

  • 相关阅读:
    CF258D
    CF662C
    CF1295F
    CF1406E
    CF1270F
    CF1278F
    CF1523E
    CF1554E
    算法第四章上机实践报告
    LCA RMQ+ST表学习笔记
  • 原文地址:https://www.cnblogs.com/zzxap/p/2175574.html
Copyright © 2011-2022 走看看