javascript - 使用 Javascript 从 textarea 解析 JSON 数据
问题描述
我试图能够将 JSON 格式的数据放入 textarea 中,以便能够一次提取一条数据。目前我只是想将名称输出到 DIV。这是一个静态 HTML 文件,包含一个文本区域、一个按钮和 1 个 DIV。我没有得到任何我不明白的输出。任何帮助将不胜感激。
HTML
<!DOCTYPE html>
<html>
<head>
<script>
function parser(){
var results = document.getElementById("results");
var information = document.getElementById("TTP");
var data = JSON.parse("information");
results.innerHTML = "";
for(var obj in data){
results.innerHTML += data[obj].user+" is present +"<br />";
}
results.innerHTML = "requesting...";
}
</script>
</head>
<body>
<textarea id="TTP"></textarea>
<div id="results"></div>
<input type="button" onClick="parser()" value="Run"></input>
</body>
</html>
JSON数据
{ "user":"John", "age":22, "country":"United States" },
{ "user":"Will", "age":27, "country":"United Kingdom" },
{ "user":"Abiel", "age":19, "country":"Mexico" },
{ "user":"Rick", "age":34, "country":"Panama" },
{ "user":"Susan", "age":23, "country":"Germany" },
{ "user":"Amy", "age":43, "country":"France" },
{ "user":"Pete", "age":18, "country":"Italy" },
{ "user":"Chris", "age":25, "country":"United States" },
{ "user":"Louis", "age":31, "country":"Spain" },
{ "user":"Emily", "age":38, "country":"Uraguay" },
{ "user":"Shawn", "age":52, "country":"Chile" },
{ "user":"Greg", "age":24, "country":"Romania" }
解决方案
您的代码中有一些问题,主要是您对信息的解析
您正在传递文字字符串"information"
而不是文本框的值
其他问题是 Nick Parsons 指出的字符串连接,results.innerHTML = "requesting...";
因为这将覆盖你的 for 循环设置的内容
function parser() {
var results = document.getElementById("results");
var information = document.getElementById("TTP");
var data = JSON.parse(information.value);
results.innerHTML = "";
for (var obj in data) {
results.innerHTML += data[obj].user + " is present <br/> ";
}
}
<textarea id="TTP"></textarea>
<div id="results"></div>
<input type="button" onClick="parser()" value="Run"></input>
PS你将不得不将你的数据集包装起来[]
以表示它是一个数组
推荐阅读
- vba - 使用 VBA 将 Excel 文件备份副本保存到 SharePoint
- c - 如何设置 PE 标头特征标志
- sql-server - 查询列出表值函数及其输入参数?
- deep-learning - Hugging Face Transformers 上的“TextInputSequence must be str”错误
- c# - 如何在 EF Core 中使用 C# 9 记录?
- r - 是否有一种算法可以删除两个单词之间的破折号(“-”)然后收缩它们?
- wordpress - Woocommerce 我的帐户页面上缺少无效的凭据提示
- javascript - 使用 firestore 生成我们自己的 id 文档
- python - Discordpy 在 var 更改时发送 dms 但收到 AttributeError: 'NoneType' object has no attribute 'send'
- amazon-web-services - 如何使用 AWS Glue ETL 工具从 S3 读取文件名