从隐藏的输入中检索 JSON 数据答案

【问题标题】：Retrieve JSON data from a hidden input从隐藏的输入中检索 JSON 数据
【发布时间】：2011-05-17 09:59:45
【问题描述】：

我将 JSON 数据存储在服务器端的 HTML 隐藏字段中。然后我想在客户端使用 Javascript 和 JQuery 检索该数据。问题是我得到的是 JSON 字符串而不是 JSON 对象。

这是我在服务器端的代码：

<form id="data" style="display: none;">
    <input id="channels" type="hidden" tal:attributes="value python: view.context['ChannelManager'].toJSON(view.channels.values())" />
    <input id="mediaGroups" type="hidden" tal:attributes="value python: view.context['MediaGroupManager'].toJSON(view.mediaGroups.values())" />
</form>

这是我在客户端的代码：

copy.channelList = new ChannelTest();
copy.channelList.fromJSONObjectAll($("#data input[id=channels]").val())

所以我从 $("#data input[id=channels]").val() 获取 JSON 字符串而不是 JSON 对象。

如何在不转换 JSON 对象中的 JSON 字符串的情况下获取 JSON 对象？

提前致谢！

【问题讨论】：

“获取JSON对象而不转换字符串”是什么意思？
我发布了我认为您想要的内容，但是那部分令人困惑。您在问如何将 json 字符串转换为对象，而不将 json 字符串转换为对象...
当我填写 HTML 输入时，数据是 JSON 对象，而不是 JSON 字符串。但是，当我在客户端获取该数据时，它是 JSON 字符串而不是 JSON 对象。我想避免在 JSON 对象中转换该 JSON 字符串。
尝试编辑这个：input[id$=channels] 并告诉我！

标签： javascript jquery

【解决方案1】：

JSON.parse(jsonString);

对于不支持原生 JSON 的旧版浏览器，您可以简单地包含 json2.js，这将成为一个可用的函数。

或者您可以使用一些服务器端脚本跳过此步骤。您可以简单地将 JSON 写入脚本标签。它被 script 标签隐式解析为原始 javascript。

<script type="text/javascript">
  var myObj = <%= myJsonString %>;
  console.log('we got this value: '+ myObj.myValue);
</script>

【讨论】：

我想避免 JSON.parse(jsonString) 因为当我将它存储在客户端时，数据是 JSON 对象。有什么问题？我可以在 HTML 输入中存储 JSON 对象吗？我不能将这种脚本与我正在使用的框架一起使用
<input> 标签只能有字符串值。因此，如果要将数据存储为字符串，则必须将其从字符串转换为 javascript 对象。或者您可以完全跳过放入 HTML 元素，并将其直接写入我上面概述的脚本标签。但是你永远不会得到一个<input> 来直接存储一个对象。只有一个字符串。请记住，表单元素对自己进行编码以进行表单提交。所以<input type="text" name="foo" value="bar"> 会像?foo=bar 一样对自己进行编码。如果那是一个 Javascript 对象，它如何将自己编码为一个复杂的对象？
@bribon：您在服务器上的数据是一个 json 字符串，无法将其作为 javascript 对象直接传输到客户端。如果您按照 Squeegy 的建议（将数据嵌入为 js 变量，那么第一次读取页面时浏览器会为您解析）