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]

  • 相关阅读:
    巴洛克式和哥特式的区别
    推荐阅读书籍,是时候再行动起来了。
    AtCoder ABC 159F Knapsack for All Segments
    AtCoder ABC 159E Dividing Chocolate
    AtCoder ABC 158F Removing Robots
    AtCoder ABC 158E Divisible Substring
    AtCoder ABC 157F Yakiniku Optimization Problem
    AtCoder ABC 157E Simple String Queries
    AtCoder ABC 157D Friend Suggestions
    AtCoder ABC 156F Modularness
  • 原文地址:https://www.cnblogs.com/zzxap/p/2175574.html
Copyright © 2011-2022 走看看