如何读取JSON文件并将键/值对加载到字典中
我试图使用JavaScript和jQuery来读取本地JSON文件，并创建一个键/值对字典，稍后我可以迭代这些字典来设置几个下拉列表的选定值。
我有一个map.json文件如下；
[
{
"map_recipient_name": "Tax payer Name",
"map_delivery_company_name": null,
"map_delivery_street_address": "Address1",
"map_delivery_apt_suite": "Address2",
"map_delivery_city": "City",
"map_delivery_state": "State",
"map_delivery_zip": "Zip",
"map_delivery_zip_4": "Zip+4",
"map_customer_reference_number": "Notice Number",
"map_notice": null,
"map_recipient_email": null,
"map_send_email": null,
"map_standardize_address": null
}
]每个键都是我的Selected控件的ID，该值是指定控件的所需的选定值。
我使用HTML type=file控件来允许用户选择本地文件系统上显示的map.json文件，并使用FileReader ReadAsText方法将内容读入局部变量。然后，我希望将字符串解析为一个键/值对字典，稍后我将对其进行迭代，以设置一系列Selected控件的“选定”值。
我正在使用下面的代码，但它似乎无法将JSON字符串键/值对成功地放入字典中。
var field_mapping = document.getElementById('fieldmapping')
function read_map_file(e) {
var map_file = e.target.files[0]
if (!map_file) {
return;
}
var dict = {};
var reader = new FileReader();
reader.onload = function (e) {
var json = e.target.result;
var result = JSON.parse(json);
$.each(result, function (key, value) {
alert(key + ' is ' + value);
//dict[key] = value;
});
};
reader.readAsText(map_file);
}
if (field_mapping.addEventListener) field_mapping.addEventListener('change', read_map_file, false);当我运行这段代码并选择map.json文件时，当我在行后面检查json变量的值时，我可以看到调试器中的文本字符串.
var json = e.target.result;..。执行。我可以看到，它在JSON文本中包含了开始和尾随双引号(我认为这是因为读取器的ReadAsText方法)。
当我检查下一行时..。
var result = JSON.parse(json);..。然后在调试器中展开"0: object“行，可以看到字符串已被解析，键/值对似乎是正确的。然而，当警报弹出在下一节代码..。
$.each(result, function (key, value) {
alert(key + ' is ' + value);
//dict[key] = value;
});..。警报对话框显示"0是对象对象“。
最后，我要做的是将这些键/值对保存到dict变量中，这样我就可以查询字典，并为每个select控件获取所选的值。
这可能很简单，但我只是没看到而已。
任何帮助都将不胜感激。
更重要的是，如果有人有更简单的方法读取本地JSON文件并使用这些值设置Selected控件的选定值，我希望看到它。
提前感谢你能提供的任何帮助。
回答 3
Stack Overflow用户
发布于 2017-05-08 20:31:38
您将JSON文件封装在一个数组中，因此希望在result[0]上循环，而不是在result上循环。
$.each(result[0], function (key, value) {
...
});或者，如果您能够控制JSON文件中的[]，就可以删除该文件中的周围的JSON，并且您的代码应该按原样工作。
Stack Overflow用户
发布于 2017-05-08 20:32:48
您的JSON.parse()语句正在返回数组。然后当你写：
$.each(result, function (key, value) {
alert(key + ' is ' + value);
//dict[key] = value;
});您正在迭代该数组，并尝试将数组(对象)中的一个和唯一的项作为只有一个值的键和值。您需要从存储在result[0]中的对象中获取键和值，因此需要向下挖掘另一层。
由于数组中只有一个项，所以$.each()过高了。要循环的对象是存储在数组位置0中的对象，而不是数组本身。
这就是你需要的：
for(var key in result[0]){
alert(key + ' is ' + result[0][key]);
}以下是工作代码：
var jsonString = JSON.stringify([
{
"map_recipient_name": "Tax payer Name",
"map_delivery_company_name": null,
"map_delivery_street_address": "Address1",
"map_delivery_apt_suite": "Address2",
"map_delivery_city": "City",
"map_delivery_state": "State",
"map_delivery_zip": "Zip",
"map_delivery_zip_4": "Zip+4",
"map_customer_reference_number": "Notice Number",
"map_notice": null,
"map_recipient_email": null,
"map_send_email": null,
"map_standardize_address": null
}
]);
var result = JSON.parse(jsonString);
for(var key in result[0]){
console.log(key + ' is ' + result[0][key]);
}
Stack Overflow用户
发布于 2017-05-08 20:32:35
您几乎已经在“字典”中获得了数据，或者正如Javascript所称的那样，它是一个对象。您所需要做的就是首先迭代外部数组，然后是内部对象的键。试试这个：
// imagine this is the content returned from your file reader in e.target.result
var result = [{
"map_recipient_name": "Tax payer Name",
"map_delivery_company_name": null,
"map_delivery_street_address": "Address1",
"map_delivery_apt_suite": "Address2",
"map_delivery_city": "City",
"map_delivery_state": "State",
"map_delivery_zip": "Zip",
"map_delivery_zip_4": "Zip+4",
"map_customer_reference_number": "Notice Number",
"map_notice": null,
"map_recipient_email": null,
"map_send_email": null,
"map_standardize_address": null
},{
"map_recipient_name": "Tax payer Name #2",
"more data goes here...": "foobar"
}];
result.forEach(function(o) {
Object.keys(o).forEach(function(key) {
console.log(key + ' = ' + o[key]);
})
});
https://stackoverflow.com/questions/43856720
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号