Javascript 保留客户端HTML标记并在回发后保留

我正在构建一个用户搜索过滤器，在这里我们可以指定许多条件，HTML表的每行一个

我在客户端使用jquery构建一个动态表，该表从页面加载的一行（默认）开始，最后一个

上有一个“+”图像，单击该图像时，我将向表中添加一个新行，并且可以对任意数量的行重复此操作，如下所示。单击搜索按钮后，我将根据所选条件返回结果。但我还需要在回发后保留当前的条件表（由于搜索按钮）

有什么办法吗？我曾尝试将表的所有HTML放在一个hiddenfield中，但出于明显的安全原因，我得到了一个RequestValidationError。我将每行中的单个选定值保存在隐藏变量中，我在代码隐藏中使用这些变量来构建搜索并获取结果，是否需要使用我的值在客户端重建表？这是唯一的选择吗？我还尝试将表格的HTML转换为文本并将其放入隐藏变量中，但回发后我无法将其转换回HTML，它在表格中呈现为文本，下面是代码，欢迎提供任何帮助/输入

HTML:

jQuery：

在回发（客户端）之前单击按钮：

jQuery（“[id*=hdncriterable]”）.val（jQuery（“#dynamicCriteriaTable tbody”）.html（）.replace（//g，”）；

回发后的页面加载（客户端）：

if（jQuery（“[id*=hdnispostback]”）。val（）=“1”）
{
//下面的注释行是我尝试使其工作的不同方式。
//带有硬编码td的是在表中完美呈现为HTML的
jQuery（“#dynamiccriteriable>tbody”）.empty（）；
var criteriaTableHTML=jQuery（“[id*=hdnCriteriaTable]”）.val（）.replace（“&；lt；”，//g.replace（“，”）；
parseHTML（criteriaTableHTML）；
//jQuery（“#dynamiccriteriable>tbody”）.append（jQuery（“[id*=hdnCriteriaTable]”）.val（）.replace（“&；lt；”，//g.replace（“，”\）.toHtml（））；
//jQuery（#dynamiccriteriable>tbody”）.append（“123456”）
jQuery（“#dynamiccriteriable>tbody”）.append（criteriaTableHTML）；
//警报（jQuery（“#dynamiccriteriable”）.html（）；
//jQuery（“#dynamiccriteriable”）.toHtml（）；
}

这是HTML在表中的呈现方式：

---

如果我是你，我会根据这些值重建表；它是干净的，您可以随时编写一个自动生成的函数

---

但是，如果您想将其作为HTML整体传递，则需要以某种方式转义标记。首先，我将用

和

分别替换

和

，如果这仍然给您一个requestValidationError，请使用另一对分隔符。

如果我是您，我将根据这些值重建表；它是干净的，您可以随时编写一个自动生成的函数

---

但是，如果您想将其作为HTML整体传递，则需要以某种方式转义标记。首先，我将用

和

分别替换

和

，如果这仍然给您一个requestValidationError，请使用另一对分隔符。

是否

jQuery.parseHTML（x）

实际修改

x

，或者只是返回

x

的解析版本？您是否尝试过

criteriaTableHTML=jQuery.parseHTML（criteriaTableHTML）

？

jQuery.parseHTML（x）

修改

x

。不管怎样，我只是尝试将它设置回同一个变量，但仍然得到相同的结果。您可以通过创建一个伪文本框，填充它，然后重新获取它的值来解码HTML字符串，就像我在中所做的那样。在将HTML附加到tbody之前，也许您可以尝试使用此方法对HTML进行实际解码。@Santi:好主意，它奏效了。但它不保留控件的选定值。我将按照

cuniculus

的建议，看看重建桌子在时间和清洁度方面是否是更好的解决方案。如果我能很快得到这些值来处理您的解决方案，我会同意。不知道为什么HTML在输入字段的值中没有设置为“Mary”和“Bob”的值，它们不会被填充。我认为它也应该设置值。

jQuery.parseHTML（x）

是否真的修改了

x

，或者只是返回了

x

的解析版本？您是否尝试过

criteriaTableHTML=jQuery.parseHTML（criteriaTableHTML）

？

jQuery.parseHTML（x）

修改

x

。不管怎样，我只是尝试将它设置回同一个变量，但仍然得到相同的结果。您可以通过创建一个伪文本框，填充它，然后重新获取它的值来解码HTML字符串，就像我在中所做的那样。在将HTML附加到tbody之前，也许您可以尝试使用此方法对HTML进行实际解码。@Santi:好主意，它奏效了。但它不保留控件的选定值。我将按照

cuniculus

的建议，看看重建桌子在时间和清洁度方面是否是更好的解决方案。如果我能很快得到这些值来处理您的解决方案，我会同意。不知道为什么HTML在输入字段的值中没有设置为“Mary”和“Bob”的值，它们不会被填充。我认为它也应该设置值。

<input type="hidden" runat="server" value="0" id="hdnCriteriaTable" />

jQuery("[id*=hdnCriteriaTable]").val(jQuery("#dynamicCriteriaTable tbody").html().replace(/</g, "&lt;").replace(/>/g, "&gt;"));

    if (jQuery("[id*=hdnispostback]").val() == "1")
    {
//commented out lines below are different ways I tried to make it work.
//the one with hardcoded td's is the one that renders perfectly as HTML inside the table
        jQuery("#dynamicCriteriaTable>tbody").empty();
        var criteriaTableHTML = jQuery("[id*=hdnCriteriaTable]").val().replace("&amp;lt;", /</g).replace("&amp;gt;", />/g).replace("&quot;", "\"");
        jQuery.parseHTML(criteriaTableHTML);
        //jQuery("#dynamicCriteriaTable>tbody").append(jQuery("[id*=hdnCriteriaTable]").val().replace("&amp;lt;", /</g).replace("&amp;gt;", />/g).replace("&quot;", "\"").toHtml());
        //jQuery("#dynamicCriteriaTable>tbody").append("<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>")
        jQuery("#dynamicCriteriaTable>tbody").append(criteriaTableHTML);
        //alert(jQuery("#dynamicCriteriaTable").html());
        //jQuery("#dynamicCriteriaTable").toHtml();
    }