2

这是一个新手 JavaScript 问题,但我不太确定如何在谷歌上寻求帮助,因为我不确定如何以简单的方式描述问题。

我有一个大的、有些复杂的 JSON,我需要对其进行操作,以便我可以通过一种方式重塑 JSON,从而获得仅包含国家、城市和销售的列表。

JSON 本身对我来说不是问题,这是我收到它后想要做的事情。基本上,我想从收到的大型 JSON 中创建 3 个单独的对象/数组,并让这 3 个单独的对象/数组可以在$.ajax调用之外使用。是的,我认为我可以在$.ajax成功回调中完成所有这些工作,但我宁愿在其他地方完成所有 JSON 处理。我的伪 JavaScript 看起来像这样:

var model = {
  countries: [],
  cities: [],
  sales: [],
  set: function(data) {
    //manipulate data here so that model.countries, model.cities, model.sales are populated
  }      
};


$.ajax({
  url: 'example.com/sample.json',
  success: function(data) {
    model.set(data);    //is this the right way to do this?
  }
});

$('#countries').html(model.countries);
$('#cities').html(model.cities);
$('#sales').html(model.sales);​

但是因为 JavaScript 是异步执行的,所以最后 3 行总是空白,因为 JSON 还没有收到。

所以我想我的问题是,如何将收到的 JSON 的结果绑定到$.ajax范围之外的变量,以便我可以在页面上的任何位置使用它?

4

3 回答 3

1

简单的解决方案是这样的:

$.ajax({
  url: 'example.com/sample.json',
  success: function(data) {
    model.set(data);
    $('#countries').html(model.countries);
    $('#cities').html(model.cities);
    $('#sales').html(model.sales);​
  }
});

如果你想要更框架化的东西,那么你可以看看Backbone.js 之类的东西。

于 2012-11-12T04:25:06.963 回答
1

在 AJAX 成功回调中填充您的 HTML(即更新您的视图)。IE

function updateView() {
  $('#countries').html(model.countries);
  $('#cities').html(model.cities);
  $('#sales').html(model.sales);​
}

$.ajax({
  url: 'example.com/sample.json',
  success: function(data) {
    model.set(data);    //is this the right way to do this?
    updateView();
  }
});
于 2012-11-12T04:26:47.720 回答
0

只需将这 3 行放在success回调中(您也可以将其分成一个函数)并跳过model填充。

有一些框架允许您将 DOM 元素绑定到 JS 对象及其数据,但在这种情况下,这可能是矫枉过正。

于 2012-11-12T04:22:04.760 回答