Question

我在将JSONP数据存储到变量时遇到问题。我需要将一个数字存储到变量中，以便我可以将其用作Google饼图的输入。例如：

我的test.json ：

{
 "name": "ProjA",
 sp": 10,
 "current": 20
}

现在我想了解SP值。

我正在尝试使用JQuery：

var sp = (function () {
    var sp = null;
    $.ajax({
        'async': false,
        'global': false,
        'url': test.json,
        'dataType': "json",
        'success': function (data) {
            json = data.sp;
        }
    });
    return json;
})();

现在我想在变量sp中得到数字10。然后将sp放在谷歌图表中：

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Topping');
    data.addColumn('number', 'Slices');
    data.addRows([
      ['Finished', sp,
      ['In Progress', 1],
      ['Canceled', 1],
      ['Rejected', 2]
    ]);

这只是一个部分代码，重要的是，它不起作用。我认为存储变量存在问题。有人可以帮帮我吗？

重要提示：我没有Web服务器！这必须使用JSONP来避免跨域！

修改

我尝试过以下示例：

 function getData(callback) {
$.ajax({
async: false,
global: false,
url: 'test.json', // make sure that you quote your filename
dataType: 'jsonp', // this is meant to be jsonp, not json
success: function (data) {
    console.log(data);
  callback(data.sp);
}


});
}

但是，跨域似乎仍然存在问题，因为控制台中的错误指出：＆＃34; XMLHttpRequest无法加载。收到无效回复。起源＆＃39; null＆＃39;因此不允许访问。的jquery-1.11.1.min.js：4＆＃34;

仍在寻找解决方案。

Answer 1

您正在使用异步调用，因此无法使用正常返回。有几种方法可以做到这一点：

<强>回调

function getData(callback) {
  $.ajax({
    async: false,
    global: false,
    url: 'test.json', // make sure that you quote your filename
    dataType: 'jsonp', // this is meant to be jsonp, not json
    success: function (data) {
      callback(data.sp);
    }
  });
}

getData(function (sp) {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Topping');
  data.addColumn('number', 'Slices');
  data.addRows([
    ['Finished', sp], // close your braces
    ['In Progress', 1],
    ['Canceled', 1],
    ['Rejected', 2]
  ]);
});

<强>无极

function getData(callback) {
  return $.ajax({
    async: false,
    global: false,
    url: 'test.json',
    dataType: 'jsonp'
  });
}

getData.then(function (data) {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Topping');
  data.addColumn('number', 'Slices');
  data.addRows([
    ['Finished', data.sp],
    ['In Progress', 1],
    ['Canceled', 1],
    ['Rejected', 2]
  ]);
});

此示例利用了jQuery使用promise interface。

这一事实

如何将JSONP存储到变量中？

1 个答案: