asp.net：将多个 div 添加到同一页面答案

【问题标题】：asp.net: adding multiple divs to the same pageasp.net：将多个 div 添加到同一页面
【发布时间】：2013-12-28 02:21:44
【问题描述】：

我正在尝试创建某种论坛，并希望每次单击按钮时都添加一个新 div（其中包含一些文本）。（稍后当我从数据库中获取所有内容时，这将改变）所以这个想法是；单击按钮，出现 div，再次单击按钮，出现另一个 div，就在最后一个的下方，无限重复。我已经创建了 1 个 div，但它不会再创建了。这是我的代码：

protected void Button1_Click(object sender, EventArgs e)
{
    i += 1;
    top += 60;
    try
    {
        Panel div = new Panel();
        div.ID = "panel" + i;
        div.CssClass = "postdiv";
        div.Style["position"] = "absolute";
        div.Style["top"] = top.ToString();
        form1.Controls.Add(div);
    }
    catch (Exception er)
    {
        Console.Write(er);
    }
}

我认为我的问题在于 div.Style["top"] = top.ToString();但我不确定。有人知道解决办法吗？

【问题讨论】：

你在哪里声明 i 和 top？问题在于存储我怀疑的 i 和 top。

标签： c# html asp.net css

【解决方案1】：

问题是每次单击按钮时i 和top 的值始终为0，因此您需要使用ViewState 或HiddenFields 来保持回发之间的值。

您还需要在每次回发时在 Page_Load 中重新创建动态创建的 div。

这是我使用 ViewState 会做的事情：

private int Counter
{
   get
   {
      if (ViewState["Counter"] == null)
      {
         return 0;
      }
      else
      {
         return (int)ViewState["Counter"];
      }
   }
   set
   {
      ViewState["Counter"] = value;
   }
}

protected void Page_Load(object sender, EventArgs e)
{
    if (this.IsPostBack)
    {
        if (this.Counter > 0)
        {
            for (int i = 0; i < this.Counter; i++)
            {
                Panel div = new Panel();
                div.ID = string.Format("panel{0}", i + 1);
                div.CssClass = "postdiv";
                div.Style["position"] = "absolute";
                div.Style["top"] = string.Format("{0}px", (60 * (i + 1)));
                form1.Controls.Add(div);
            }
        }
    }
}

protected void Button1_Click(object sender, EventArgs e)
{
    this.Counter += 1;

    try
    {
        Panel div = new Panel();
        div.ID = string.Format("panel{0}", this.Counter);
        div.CssClass = "postdiv";
        div.Style["position"] = "absolute";
        div.Style["top"] = string.Format("{0}px", (60 * this.Counter));
        form1.Controls.Add(div);
    }
    catch (Exception er)
    {
        Console.Write(er);
    }
}

【讨论】：

嗯，调试时我注意到值确实按预期上升，div 就不会出现。
顺便说一句，该解决方案不起作用。它仍然只创建第一个 div。
不幸的是，它仍然不起作用。是否有另一种（相当简单的）方法来添加 div 或者我应该以完全不同的方式来解决这个问题？
该代码适用于我，每次单击按钮时它都会添加一个新的 div。如果您不需要回发，还有另一种方法可以使用 jquery 添加 div。
我刚刚使用开发者工具 (F12) 浏览了网站上的 html，显然“top”的属性值无效。我是否使用了错误的文档类型或类似的东西？

【解决方案2】：

指定顶部样式时请添加“px”：

   div.Style["top"] = top.ToString() + "px";

【讨论】：

【解决方案3】：

您需要考虑到，每次您的浏览器往返于服务器（无论是第一次还是后续 - 回发）时，都需要从头开始重新创建页面的对象模型。

您在后面的代码中创建的任何变量、控件或对象都不会在回发后继续存在。

因此，您需要添加控件EACH TIME，以执行后面的代码。这就是为什么您需要@ekad 提供的方法。您的控件生成例程需要在循环中。

【讨论】：