javascript - 使用ajax调用获取包含3个数组的json对象并将数组传递给javascript

Question

我有一个页面创建以下输出:

<script>
  var JSONObject = { "groups":['1210103','1210103','1210103','1210405'],
                     "prices":['279,00','399,00','628,00','129,00'],
                     "titles":['','','','']
                    }; 
</script>

此页面由 ajax 调用调用:

$.ajax({url:plink,success: function(result) { }

我现在需要接收 json 数组并将它们传递给普通的 javascript 数组。我该怎么做？

我尝试过:

result = jQuery.parseJSON(data);
mygroups = result.groups;
myprices = result.prices;
mylabels = result.titles;

Answer 1

更改您的页面，使其仅生成 JSON:

{"groups":["1210103","1210103","1210103","1210405"],
 "prices":["279,00","399,00","628,00","129,00"],
 "titles":["","","",""]
}

请注意，在 JSON 中，您必须使用 "，而不是 ' 来引用字符串。

让它返回 application/json 的 Content-Type header 。如果由于某种原因您无法在响应上设置正确的 Content-Type header ，您可以通过添加 dataType: 'json' 强制 jQuery 将响应视为 JSON到您的 ajax 调用，但最好使用正确的 content-Type。

然后在您的 ajax 调用的 success 回调中，result 将已经是一个具有三个属性的反序列化对象( groups、prices、titles)，这将是您可以使用的 JavaScript 数组。

Live Example | Source

<小时/>

您在下面的评论中说过，该页面是一个完整的 HTML 页面，嵌入了 script 标记，除了 script 的内容之外，您无法控制它 code> 标记，因为您使用的 CMS。

我强烈建议迁移到更灵活的 CMS。

除非/除非您可以这样做，否则您可以简单地以文本形式接收页面，然后提取 JSON。将您的 script 标记更改为如下所示:

<script>
var JSONObject = /*XXX_JSONSTART_XXX*/{"groups":["1210103","1210103","1210103","1210405"],
 "prices":["279,00","399,00","628,00","129,00"],
 "titles":["","","",""]
}/*XXX_JSONEND_XXX*/;
</script>

注意标记。然后，您可以提取标记之间的 JSON，并对其使用 $.parseJSON 。示例:

(function($) {

  $.ajax({
    url: "http://jsbin.com/ecolok/1",
    dataType: "text",
    success: function(result) {
      var startMarker = "/*XXX_JSONSTART_XXX*/";
      var endMarker   = "/*XXX_JSONEND_XXX*/";
      var start, end;

      start = result.indexOf(startMarker);
      if (start === -1) {
        display("Start marker missing");
      }
      else {
        start += startMarker.length;
        end = result.indexOf(endMarker, start);
        if (end === -1) {
          display("End marker missing");
        }
        else {
          result = $.parseJSON(result.substring(start, end));
          display("result.groups.length = " + result.groups.length);
          display("result.prices.length = " + result.prices.length);
          display("result.titles.length = " + result.titles.length);
        }
      }
    }
  });

  function display(msg) {
    $("<p>").html(String(msg)).appendTo(document.body);
  }

})(jQuery);

Live Copy | Source