JS：传递的 JSON-Array 丢失引号

Posted 2023-03-05

【中文标题】JS：传递的 JSON-Array 丢失引号

【英文标题】：JS: Passed JSON-Array loses quotation marks

【发布时间】：2019-11-02 17:43:08

【问题描述】：

基本上我正在尝试通过 onclick 将 json-array 传递给函数

<button
  onclick='showAccountOverviewModal("<%= accounts[j].name %>", `<%= accounts[j].bills%>`)'>
  Click Me
</button>

但是，当我尝试通过 JSON.parse 解析字符串时，我意识到键和值都没有引号。有什么“好”的方法可以解决这个问题还是我需要使用正则表达式？

最好的问候

编辑

这是对应的函数：

function showAccountOverviewModal(accountName, accountBills) 
  $("#accountModalOverviewTitle").text(accountName);
  accountBills = JSON.parse(accountBills);
  console.log(accountBills);
  accountBills.forEach(bill => 
    console.log(bill);
  );

【问题讨论】：

你能展示一些showAccountOverviewModal函数吗？了解如何使用这些论点会很有帮助。你用什么来解析<%= 构造？

@TomHolmes 编辑代码以提供更多信息

您有一些 ASP 或 EJS 或其他东西，您正在使用嵌入的 javascript 生成 html。 查看生成的 HTML。弄清楚它有什么问题，然后担心如何更改 ASP/EJS/whatever 以使其生成您真正需要的内容。

【参考方案1】：

将使用 data-* 属性重写您的代码。如果你不想要这种方法，你可以忽略。

html

<button class="showaccountmodal" 
data-accountName="<%= accounts[j].name %> 
data-bill="<%= accounts[j].bills %>">Click Me</button>

jquery

$(".showaccountmodal").on('click', function() 
var accountname = $(this).data('accountName');
var bill = $(this).data('bill');
console.log(accountname);
console.log(bill);
 accountBills.forEach(bill => 
    console.log(bill);
  );
 );

这里还有一个在html中存储json对象的参考Store JSON object in data attribute in HTML jQuery

【参考方案2】：

看起来您可能正在传递一个 javascript 数组（已经解析）而不是 JSON 数组（一个表示数组的字符串）。如果是这样，在JSON.parse它之前，运行

console.log(Array.isArray(accountBills))

应该打印true。如果它实际上是 JSON，那将打印 false 并运行

console.log(typeof accountBills)

将打印string。

如果它是一个数组，那么你不需要解析它，删除JSON.parse 行应该可以使其按预期工作。