使用 Javascript 从 textarea 解析 JSON 数据 [英] Parsing JSON data from textarea with Javascript

查看:46
本文介绍了使用 Javascript 从 textarea 解析 JSON 数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试将 JSON 格式的数据放入文本区域,以便能够一次提取一份数据.目前我只是想将名称输出到 DIV.这是一个带有一个文本区域、一个按钮和 1 个 DIV 的静态 HTML 文件.我没有得到任何我不明白的输出.任何帮助将不胜感激.

I am trying to be able to drop JSON formatted data into a textarea to be able to pull out one piece of data at a time. Currently I am just trying to get the names output to a DIV. This is a static HTML file with one textarea, one button and 1 DIV. I am not getting any output which I do not understand. Any assistance would be greatly appreciated.

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" }

推荐答案

function parser(){
    var results = document.getElementById("results");
    var information = document.getElementById("TTP").value;             // <-- 1
            var data = JSON.parse(information);                         // <-- 2
            results.innerHTML = "";
            for(var obj in data){
                results.innerHTML += data[obj].user+" is present <br>"; // <-- 3
            }
    //results.innerHTML = "requesting...";                              // <-- 4
}

<textarea id="TTP">[{ "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" }]</textarea>
<div id="results"></div>
<input type="button" onClick="parser()" value="Run"></input>

变化:

  1. document.getElementById() 获取一个元素,你需要它的value
  2. "information" 是一个字符串,information 是你要解析的变量
  3. " is present +"
    "
    不是正确的字符串
  4. requesting..."字符串覆盖了结果,现在被注释了
  5. 你的 JSON 不是 JSON,它需要围绕 []-s 成为一个列表
  1. document.getElementById() gets an element, you need its value
  2. "information" is a string, information is the variable you want to parse
  3. " is present +"<br />" was not a correct string
  4. The "requesting..." string overwrote the result, it is commented now
  5. Your JSON is not a JSON, it needs surrounding []-s to become a list

这篇关于使用 Javascript 从 textarea 解析 JSON 数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆