在 onclick 事件中传递参数时转义撇号

Question

我将公司名称传递给 onclick 事件。有些公司名称中含有撇号。我将 '.Replace("'", "'")' 添加到 company_name 字段。这允许触发 onclick 事件，但确认消息显示为“Jane's Welding Company”。

<a href="#" onclick="return Actionclick('<%= Url.Action("Activate", new {id = item.company_id}) %>', '<%= Html.Encode(item.company1.company_name.Replace("'", "&#39;")) %>');" class="fg-button fg-button-icon-solo ui-state-default ui-corner-all"><span class="ui-icon ui-icon-refresh"></span></a>

<script type="text/javascript">
function Actionclick(url, companyName) 
{
    if (confirm('This action will activate this company\'s primary company ('+companyName+') and all of its other subsidiaries.  Continue?')) 
    {
        location.href = url;
    };
};

编辑 确认消息显示 &# 39;在消息中而不是在 '.当我在这里输入它时，它取代了 &# 39;带有 '.添加了空格，这样就不会发生这种情况。我想知道将其传递给 onclick 事件并在消息中正确显示它而不进行多次替换的最佳方法（如果有更好的方法）。

Answer 1

我认为有两种选择。

1. 如果您将参数括在引号 (") 而不是撇号/单引号 (') 中，那么您根本不需要转义它。HTML 编码将负责对任何引号进行编码（如果它们位于字符串中） ) 并且撇号不会成为问题。不过，由于 javascript 已经用引号引起来，因此您需要使用反斜杠转义引号，例如：

   onclick="return Actionclick(\"<%= Url.Action("激活", new {id = item.company_id}) %>\", \"<%= Html.Encode (item.company1.company_name) %>\");"

2. 反斜杠转义公司名称，因为它只是需要转义撇号的最终 JavaScript 字符串，而不是 HTML，例如：

   onclick="return Actionclick('<%= Url.Action("激活", new {id = item.company_id}) %>', '<%= Html.Encode(item. company1.company_name.Replace("'", "\\'")) %>');"

Answer 2

HTML 属性值内有一个 JavaScript 字符串文字。

因此，您需要首先对值进行 JS 编码（将 ' 替换为 \' 并将 \ 替换为 \\)，然后 HTML 编码。目前，您正在对 ' 进行 HTML 编码（这将是无效的，因为浏览器会在 JS 引擎看到它之前将其解码回撇号）...然后再次对它进行 HTML 编码，留下它的字面意思是'。

使用 JSON 编码器将字符串（或任何其他值类型）转换为 JavaScript 文本。

然而。在字符串中编写 JavaScript 非常糟糕。追踪多层的逃避并不是大脑所擅长的。所以不要这样做。始终避免内联事件处理程序属性。相反，使用静态脚本并使用不显眼的脚本从 JavaScript 本身分配处理程序。

<a class="dangerous fg-button fg-button-icon-solo ui-state-default ui-corner-all"
    href="<%= Server.HTMLEncode(Url.Action("Activate", new {id = item.company_id})) %>"
    title="This action will activate this company's primary company (<%= Server.HTMLEncode(companyName) %>) and all of its other subsidiaries."
>
    <span class="ui-icon ui-icon-refresh"></span>
</a>

（我将使用 jQuery，因为您的标签中有它：）

<script type="text/javascript">
    $('.dangerous').click(function() {
        return confirm(this.title+' Continue?');
    });
</script>

但是请注意，这是对 的滥用。对某些内容进行主动更改的操作绝不应作为 GET 请求发送或允许接收。您应该使用提交 POST 请求的按钮（直接作为表单或通过 AJAX）。 （您还应该考虑使用 ASP.NET 的内置控件，而不是对其中的值进行模板化，以避免调用 HTMLEncode 太多。）

请参阅 这个经典的WTF，了解它可能会咬你一口的一种方式。

Answer 3

5 年后我才遇到这个问题，所以我将分享对我有用的方法。

查看 HttpUtility.JavaScriptStringEncode< MSDN 上的 /a>

您可以在设置属性值时使用它在服务器端对字符串进行编码。这将生成撇号的 unicode 表示形式 - “\u0027”，可以将其传递给 JavaScript onclick。

对于原始示例：

item.company1.company_name = HttpUtility.JavaScriptStringEncode("Jane's Welding Company");

将变为

"Jane'\u0027s Welding Company"

关于 HttpUtility.JavaScriptStringEncode 的注释 - 您可以选择指定一个布尔值来对带有双引号的字符串进行编码 (bool addDoubleQuotes)。但是，由于该字符串将用作 JavaScript 函数的参数，因此您不需要额外的引号。