getJson returns 所有处理程序而不是数据

getJson returns all Handlers instead of data

我正在尝试从我的文件系统加载 html 应用程序中的 config.json:

var data = $.getJSON('../../modules/config.json');
console.log(data);

但我没有收到来自 json 文件的数据(路径是正确的,我检查了两次)而是我得到了这个:

Object {readyState: 1, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}abort: function (a){var b=a||u;return i&&i.abort(b),x(0,b),this}always: function (){return e.done(arguments).fail(arguments),this}complete: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}done: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}arguments: nullcaller: nulllength: 0name: ""prototype: m.Callbacks.k.add__proto__: function Empty() {}<function scope>error: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}fail: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}getAllResponseHeaders: function (){return 2===t?f:null}getResponseHeader: function (a){var b;if(2===t){if(!j){j={};while(b=Cc.exec(f))j[b[1].toLowerCase()]=b[2]}b=j[a.toLowerCase()]}return null==b?null:b}overrideMimeType: function (a){return t||(k.mimeType=a),this}pipe: function (){var a=arguments;return m.Deferred(function(c){m.each(b,function(b,f){var g=m.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&m.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}progress: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}promise: function (a){return null!=a?m.extend(a,d):d}readyState: 1setRequestHeader: function (a,b){var c=a.toLowerCase();return t||(a=s[c]=s[c]||a,r[a]=b),this}state: function (){return c}statusCode: function (a){var b;if(a)if(2>t)for(b in a)q[b]=[q[b],a[b]];else v.always(a[v.status]);return this}success: function (){if(h){var d=h.length;!function f(b){m.each(b,function(b,c){var d=m.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&f(c)})}(arguments),b?e=h.length:c&&(g=d,j(c))}return this}arguments: nullcaller: nulllength: 0name: ""prototype: m.Callbacks.k.add__proto__: function Empty() {}<function scope>then: function (){var a=arguments;return m.Deferred(function(c){m.each(b,function(b,f){var g=m.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&m.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}__proto__: Object

它似乎是所有处理程序,但我只想从 json.file 获取我的数据。我想我只是错过了一件非常小的事情。

getJson 函数 returns XHR(这是您在控制台中看到的)而不是请求收到的数据。要获取需要使用回调参数的数据:

$.getJSON('../../modules/config.json', function(data) {
    console.log(data);
});

从 URL 获取 JSON:

$.getJSON('../../modules/config.json').success(function(data){
    // data is an array
});

Example on JSFiddle.

其实你漏掉了一件大事。 $.getJSON 应该异步工作。而不是您服务器的本地文件。当站点变为 public 并且用户在他的浏览器中加载您的页面时,将不再是任何 local files from server。该方法接受 URL,而不是本地路径,所以最后请求的 json 文件应该由网络服务器提供,并且回调将在成功时执行

var url = 'http://localhost/yourwebapp/config.json';//for testing locally on developer's pc
$.getJSON(url, function(data){
    var config = JSON.parse(data);
});

getJSON 的 return 值实际上是一个 jqXHR 对象,允许以某种方式控制请求,但不能控制数据