与文本框有关的HTML编码/解码

Question

我正在从Microsoft堆栈（即WPF）过渡到HTML5，因此对于这个问题的非专业性质，我们会提前道歉。

当前的主题是HTML编码和解码。

考虑一个HTML5应用程序，它通过HTTP对C＃后端进行AJAX调用。 服务器仅返回JSON格式的数据，始终确保使用HttpUtility.HTMLEncode()对JSON值字段进行HTML编码。

HTML5客户端反向执行相同的过程。 首先，使用简单的JavaScript帮助程序功能将所有发布到服务器的数据进行HTML解码。

HTML5应用程序中所有可能显示的字符串数据都以HTML编码形式存储并从一个地方传递到另一个地方。 这个方案对我来说效果很好。 但是今天，我发现了HTML5文本框，并发现了一些奇怪的地方。 文本框似乎不喜欢编码文本。

如果我有这样定义的文本框：

<input id="festus" type="text"/>

并进行如下更新：

$("#festus").val(someEncodedString)

…文本框显示嵌入到someEncodedString中的实际代码，而不是将这些代码转换为适当的字符。 我为浏览器对所有DOM元素执行正确的转义码解释而感到惊讶。

我试图通过为val（）编写一个名为val2（）的辅助程序/包装程序来解决问题：

$.prototype.val2=function(newVal){
    return (newVal===undefined)
        ?iHub.Utils.encodeHTML(this.val())      //getting value
        :this.val(iHub.Utils.decodeHTML(newVal));   //setting value
}

[iHub.Utils是我编写的辅助函数库]

这里的想法是val2（）将在获取值时对从我的文本框中检索的数据进行适当的编码，并在设置值之前对其进行解码。 这似乎可行，但我无法撼动这种感觉，即我必须对HTML5中编码/解码应如何工作产生基本的误解。

使用文本框时是否对数据进行编码/解码是标准做法？ 文本框是否在某种程度上具有特殊性，与<p>和<select>类的其他常见元素不同，它们在显示编码的输入字符串时不执行标准解码？

再次，抱歉，如果这太基础了。 HTML5和JavaScript对我来说还很陌生，我的“ HTML5简介”类型的书并没有真正深入地讨论这个主题。

Answer 1

HTML编码用于HTML文档。 如果你是包括HTML文件本身，例如，在你的价值<input value="10 &gt; 5" />你会对其进行编码，以确保事情像>在你的价值不会混淆与>封闭标签。

但是，当您使用JavaScript设置字段的值时，就不会有混淆的余地。 您没有在修改<input.../>类的标签； 您正在修改JavaScript对象。 因此，您不应该对该值进行HTML编码。 如果您使用的是字符串变量，例如您的示例，则根本不需要进行任何编码。

另一方面，如果您使用字符串文字来指定值，则需要将其编码为JavaScript字符串，例如，通过在$("#festus").val('can\\'t')转义' $("#festus").val('can\\'t') 。 这与您进行HTML编码的原因完全相同； 避免与关闭字符串的'混淆。

您唯一一次使用JavaScript进行HTML编码的时候就是使用它来生成HTML代码，例如el.innerHTML = '<input value="10 &gt; 5" />'; 。

因此，我建议您不要在AJAX响应或请求中对字符串进行HTML编码。 相反，请避免编码，直到您实际生成需要编码的那种代码为止。 因此，在编写HTML时仅使用HTML编码字符串，在编写JavaScript时仅使用JavaScript编码字符串，依此类推。