美元.getJSON不会将数据保存到全局变量/对象中,这是本地的

$.getJSON is not saving data into global variable/object, which is local there

本文关键字:对象 全局变量 getJSON 数据 保存 美元      更新时间:2023-09-26

我有一个文件data .json:

{
"street":"Oslo West 555",
"age":33,
"phone":"555 1234567"
}

我想用JavaScript(和JQuery)读取这个文件,并将值存储到一个对象中。

我有HTML文件(相同的目录):

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JSON Sample</title>
</head>
<body>
<p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
var JSONObject = {};
function add(key, value)  {
    JSONObject[key] = value;
}
add("name", "John Johnson");
$.getJSON('data3.json', function(data) {
        $.each( data, function( key, val ) {
            console.log(JSONObject);
            console.log(key + ": " + val);
            JSONObject[key] = val;
        });
});
$("#jname")[0].innerHTML    = JSONObject.name;
$("#jage")[0].innerHTML = JSONObject.age;
$("#jstreet")[0].innerHTML  = JSONObject.street;
$("#jphone")[0].innerHTML   = JSONObject.phone;
</script>
</body>
</html>

在浏览器中我得到:

Name: John Johnson
Age: undefined
Address: undefined
Phone: undefined

在控制台我得到:

street: Oslo West 555
Object { street="Oslo West 555"}
age: 33
Object { street="Oslo West 555", age=33}
phone: 555 1234567
Object { street="Oslo West 555", age=33, phone="555 1234567"}

我已经测试了用函数add(…)在函数内添加值,它工作得很好。$。

如何强制$。getJSON添加数据到我的变量JSONObject?

$.getJSON('data3.json', function(data) {
     JSONObject = data;
     $("#jname").html(JSONObject.name);
     $("#jage").html(JSONObject.age);
     $("#jstreet").html(JSONObject.street);
     $("#jphone").html(JSONObject.phone); 
});