javascript - 在回发过程中保留动态插入的内容

Question

我有一个 div 让我们说:

<div id="foo">
</div>

现在，我在单击某个按钮时在此 div 中插入了一些 html 内容(无回发)。现在，当我对服务器控件提交按钮上的某些操作执行回发时，我希望将 html(我通过 javascript 插入的)保留在 foo div 中。现在我正在考虑采用隐藏的输入服务器控件，当提交表单时，我将在该隐藏控件中插入 foo div 的内容，下次回发后加载页面时，我将用以下内容填充 foo div隐藏字段内的内容。我是否采用正确的方法或者我应该选择他们的任何其他好方法？

Answer 1

我认为更好的方法是使用 'foo' 的 asp 面板而不是 div，然后将其包装在更新面板中，并使用按钮作为触发器。这将允许您通过 ajax 回发在服务器端设置面板的内容。

但是，如果您确实决定使用您提到的方法，您可能可以执行如下操作:

标记:

  <asp:Hidden ID="hdnContent" Value="" runat="server"/>
  <div id="foo"></div>

脚本:

$(document).ready(function() {

    $('#foo').html($('#<%= hdnContent.ClientID %>').val());

    $('#trigger').click(function() {

         var content = loadSomeContent();

         $('#foo').html(content);
         $('#<%= hdnContent.ClientID %>').val(content);

    });

});

<小时/>

这是更新面板的可能解决方案:

标记:

<asp:UpdatePanel runat="server">
    <ContentTemplate>

        <div id="foo">
            <asp:Literal ID="litFoo" runat="server"/>
        </div>

        <asp:Button ID="btnContent" Text="Insert Content" OnClick="btnContent_OnClick" runat="server"/>
    </ContextTemplate>
</asp:UpdatePanel>

服务器端:

protected void btnContent_OnClick(object sender, EventArgs args)
{
    litFoo.Text = loadContent();
}