我是JavaScript和JSON的自学成才。我发现了一个似乎是一个基本错误,但无法辨别答案。
我试图读取格式为JSON文本的文件,然后将文件解析为JavaScript对象。此时,我收到错误:
Uncaught SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)
at objectifyJSONStr (pen.js:54:26)
at FileReader.fr.onload (pen.js:48:5)
这是我在CodePen上运行笔时遇到的错误。见 infra 。
我已经研究了JSON输入的意外结束&#34;&#34;在这个论坛上,已经阅读了大部分问题。在与我的情况最相关的那些中,答案是JSON没有正确格式化。
但我已使用在线验证器(JSONLint - The JSON Validator)验证了JSON。 (JSON在BBEdit for Mac(11.6.4)中格式化,并保存为Unicode(UTF-8)文件。)
所以,这似乎不是问题,我不知道是什么问题。
在这个论坛上有一个问题,cors unexpected end of JSON input,这可能是相关的,但我知道CORS并不知道它将如何涉及到这里,也不知道如果这确实是问题的解决方法
HTML是:
<html lan="en">
<head>
<title="A JSON exercise"></title>
</head>
<body>
<input id="FileInput" name="files[]" type="file" accept="application/json" />
<output id="OutputArea"</output>
</body>
</html>
JavaScript是:
document.getElementById('FileInput').addEventListener('change', readFile, false);
var f = {}, fr = {}, file = "", obj = {}, FHCClassSchedule = {};
function readFile(){
f = document.getElementById('FileInput').files[0];
fr = new FileReader();
fr.onload = function(e){
var el = document.getElementById('OutputArea');
el.innerHTML += "files[0] : " + f +"<br><br>" + "file : " + fr.result;
objectifyJSONStr();
};
fr.readAsText(f);
file = fr.result;
}
function objectifyJSONStr(){
FHCClassSchedule = JSON.parse(file);
var el = document.getElementById('OutputArea');
el.innerHTML += "FHCClassSchedule[0].time : " + FHCClassSchedule[0].time + "<br>" +
"FHCClassSchedule[0].instructorImgHref : " +
FHCClassSchedule[0].instructorImgHref + "<br>";
}
JSON是:
{
"FHC-Class-Schedule": [
{
"time": "0830",
"room": "A-I",
"classTitle": "Keynote Address",
"classDescription": "Room I[content to come]",
"instructorName": "Crista Cowen",
"instructorGender": "female",
"instructorBio": "Crista Cowan has been employed by Ancestry.com since 2004; her involvement in family history, however, reaches all the way back to childhood. From being parked under a microfilm reader at the Family History Library in her baby carrier to her current career as a professional genealogist, Crista has spent thousands of hours discovering, documenting and telling family stories. She is known as The Barefoot Genealogist. You can watch her weekly internet show on the Ancestry YouTube channel.",
"instructorImgHref": ""
},
{
"time": "0900",
"room": "A",
"classTitle": "How To Use Ancestry.com",
"classDescription": "This presentation is designed for someone new to Ancestry.com and will introduce participants to basic search features in Ancestry. We will cover how to do a basic search from your family tree, how to use a general search form, and how to perform collection-specific searches. We will also cover ways to keep learning about how to use Ancestry.",
"instructorName": "Mindy McLane",
"instructorGender": "female",
"instructorBio": "Mindy McLane grew up in northern Minnesota. She majored in Latin American Studies and minored in business management at BYU. She's been married for 14 years, and working diligently on family history for just about as long. She and her family moved from Iowa to Oklahoma in 2015 when her husband took a job at NSU.",
"instructorImgHref": "https://static1.squarespace.com/static/546d0ba7e4b03f89760fd462/t/54b4806ae4b043943fa5a471/1463443824178/McLane_Mindy.jpg?format=300w"
}
]
}
CodePen案例减少,A JSON Exercise。您将需要一个本地JSON文件来运行它。
编辑01: