在javascript中转义数据元素中的撇号

escaping apostrophe within data elements in javascript

本文关键字:元素 数据 javascript 转义      更新时间:2023-09-26
currRow = currRow + '<td><a href="#" onclick="viewTCsystem(' + data['DATA']['SYSTEM_ID'][i] + ','''+ data['DATA']['SYSTEM_NAME'][i] + ''');">' + data['DATA']['SYSTEM_NAME'][i] + '</a></td>...

一个参数应该是(723,'Hammer')的例子,Hammer's作为链接。

问题在于有撇号的system_names。不知道如何转义撇号并保留单引号。

var _id = data['DATA']['SYSTEM_ID'][i].replace("'","''");
var _data = data['DATA']['SYSTEM_NAME'][i].replace("'","''");
currRow = currRow + '<td><a href="#" onclick="viewTCsystem(' + _id + ','''+ _data + ''');">' + _data + '</a></td>...

除非我误解了你真正想要的

对于JS字面值,将所有'替换为''(将'转义为RegEx);

 thing = thing.replace(/''/g, '''''')

由于字符串似乎来自外部源,您可以使用.replace方法。

data['DATA']['SYSTEM_NAME'][i].replace("'","''")

您可以使用多种方法:

str = "Foo's bar";
str = 'Foo''s bar';

两个都很好,但也许清洁工是第一个。
因此,您的代码将变成:

currRow = currRow + '<td><a href=# onclick=''viewTCsystem(' + data['DATA']['SYSTEM_ID'][i] + ',"' + data['DATA']['SYSTEM_NAME'][i] + '");''>' + data['DATA']['SYSTEM_NAME'][i] + '</a></td>';

我们刚刚把两种类型的引号颠倒了。

更好:

顺便说一下,你真的应该看看一些模板系统,如Mustache或Jade

如果有了Mustache,它将变成:

{{#DATA}}
  <td><a href="#" onclick="viewTCsystem({{SYSTEM_ID}}, '{{SYSTEM_NAME}}');">{{SYSTEM_NAME}}</a></td>
{{/DATA}}

其中DATA为:

var DATA = {
   {SYSTEM_ID: 01, SYSTEM_NAME: "Foo's"},
   {SYSTEM_ID: 02, SYSTEM_NAME: "Bar's"}
};

更好:

同样,最好将标记和逻辑分开,所以它可以变成:
{{#DATA}}
  <td><a href="#" class="view-tc-system" data-id ="{{SYSTEM_ID}}" data-name="{{SYSTEM_NAME}}">{{SYSTEM_NAME}}</a></td>
{{/DATA}}
jQuery:

function handleViewTCsystem() {
    viewTCsystem($(this).data("id"), $(this).data("name"));
}
$(document).on("click", ".view-tc-system", handleViewTCsystem);


最重要的一点:

你真的应该转义整个名称,以避免任何类型的冲突或JS注入(XSS)。

我想到的第一件事是btoa()atob()函数。您可以使用btoa(SYSTEM_NAME)使字符串安全,然后在viewTcSystem()中将其转换为atob(SYSTEM_NAME)