c# - 单击另一个 div 时如何动态设置 Javascript 以展开 div？

Question

我正在使用动态创建的 div 在 asp.net 中创建一个主菜单。

div 与 3 个不同的级别相关联。

我已经完成了所需的一切，但在展开和折叠菜单时遇到困难。

我只需要在页面加载时显示 1 级元素(使用 CSS 可能更容易？)

然后我需要能够在单击特定 level1 元素时展开 level2 元素。

然后我需要在一段时间后折叠它们。

下面的代码显示了如何创建 div 以及特定级别的语句:

  private void CreateDiv(string divId, string URL, int level)
    {
        //Attributes for all items
        HtmlGenericControl div = new HtmlGenericControl("div");
        div.Attributes.Add("id", divId);

        div.Controls.Add(
            new Label()
            {
                ID = "lbl" + divId,
                Text = divId
            });


        if (level == 1)
        {

            div.Attributes.Add("class", "level1");
            //Code to expand level 2 items

        }

        if (level == 2)
        {
            div.Attributes.Add("class", "level2");
            //Code to expand level 3 items
        }
        if (level == 3) //Specific attributes for level 3 items
        {
            div.Attributes.Add("class", "level3");
            div.Attributes.Add("onclick", "window.open('" + URL + "', 'mywindow');");
        }
        divMenuleft.Controls.Add(div);

    }

Answer 1

CSS:

<style type="text/css">
#content > div {
display: none;
}

#content > div:target {
display: block;
}</style>

HTML:(列出元素链接)

<ol>
<li>
    <a href="#div1">Menu Item MAIN</a></li>
</ol>

HTML:

<div id="div1">
    <a>
        Menu Item CHILD</a> </div>