JSON.parse 和 JSON.stringify 字符串中特殊字符错误

Question

console.log(JSON.stringify($('.btn').attr('data-obj')))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-info user_action" data-action="edit_faqs" data-obj="{SysID:2,Artist:Json Mras,Song:I'm yours}" data-toggle="modal " data-target="#SongsModal
  "><i class="fa fa-edit "></i> Edit</button>

我找到了 this，但这对我来说有点不同。

当我尝试对我在开发工具中看到的数据使用 JSON.stringify 时

//I want I'm Yours
"{\"Song\":\"I"

数据存储在我的数据库中，我在 ajax 请求中获取它，我想对它使用 JSON.stringify 因为我将把它作为按钮上的 data-*当我单击按钮时将使用它。单击按钮时，我想使用 JSON.parse 以便我可以对其进行迭代。

如何转义 JSON.stringify 和 JSON.parse

中的所有特殊字符

错误是：

Uncaught SyntaxError: Unexpected end of JSON input

即指向JSON.stringify

添加了一个片段，但没有重现问题，所以我添加了一张图片

数据库：

更新：

我从 ajax 请求中获取数据。获取数据后，我使用 data_array = JSON.stringify(data[i]); 然后将数据应用为 data-obj='" + data_array + "'

Answer 1

这不是 JSON 的问题，这是您滥用 HTML 的问题。

您可能从模板中插入了一个原始字符串到 HTML 属性中，可能是通过执行

之类的操作

<button data-obj="<?php echo json_encode($data); ?>">

或者可能在 JavaScript

container.innerHTML = '<button data-obj="' + JSON.stringify(data) + '">';

所以您的引述最终会与 HTML 的引述发生冲突。您需要将报价更改为 HTML 个实体；如果您在 HTML 属性周围使用双引号（最常见的情况），则最小值是将双引号 " 更改为 "。

您还没有告诉我们如何将内容插入 HTML，所以在您澄清之前我无法告诉您如何操作。

编辑：显然您正在通过串联在 JavaScript 中构建 HTML。在那种情况下，我展示的解决方案将起作用：

container.innerHTML = '<button data-obj="' + data_array.replace(/"/g, '&quot;') + '">';

或者，如果您使用单引号将属性括起来（不常用，但肯定是一个选项），您需要将 those 更改为 ' 而是：

container.innerHTML = "<button data-obj='" + data_array.replace(/'/g, '&apos;') + "'>";

但是，考虑到我们正在谈论的是 JavaScript，并且它可以与 DOM 一起使用，并且 DOM 知道什么是什么...还有许多其他解决方案。最原始的是直接用DOM工作：

let button = document.createElement('button');
button.setAttribute('data-obj', data_array);
container.appendChild(button);

当你这样做时，JavaScript 直接操作 DOM，而不是 HTML，因此不需要转义。

高于此级别将使用像 jQuery:

这样的库

$('<button>').data('obj', data_array).appendTo('#container');

高于此水平的是使用采用数据绑定的库，例如 Angular、React、Vue、Ractive...您只需在模型和文档上设置值自动反映该更改。

只有在直接操作HTML时才需要手动将"更改为"。

JSON.parse 和 JSON.stringify 字符串中特殊字符错误

JSON.parse and JSON.stringify error on special character in string

javascript

jquery

json

stringify