[英]getJSON method does not work
下面是我的代码,其中getJSON方法不起作用
function loadJson() {
$(document).ready(function () {
alert("inside");
var chart;
var url = "values.json";
var seriesData = [];
var xCategories = [];
var i, cat;
alert("outside");
$.getJSON(url, function (data) {
alert("inside JSON function");
for (i = 0; i < data.length; i++) {
cat = '' + data[i].period_name;
if (xCategories.indexOf(cat) === -1) {
xCategories[xCategories.length] = cat;
}
}
for (i = 0; i < data.length; i++) {
if (seriesData) {
var currSeries = seriesData.filter(function (seriesObject) {
return seriesObject.name == data[i].series_name;
}
);
if (currSeries.length === 0) {
seriesData[seriesData.length] = currSeries = { name: data[i].series_name, data: [] };
} else {
currSeries = currSeries[0];
}
var index = currSeries.data.length;
currSeries.data[index] = data[i].period_final_value;
}
else {
seriesData[0] = { name: data[i].series_name, data: [data[i].period_final_value] }
}
}
//var chart;
//$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'bar'
},
title: {
text: 'Stacked column chart'
},
xAxis: {
categories: xCategories
},
yAxis: {
//min: 0,
//max: 100,
title: {
text: 'Total fruit consumption'
},
stackLabels: {
enabled: false,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -100,
verticalAlign: 'top',
y: 20,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>'
}
},
series: seriesData
});
});
});
}
在url中,values.json是我的JSON文件,如下所示
[{"series_name":"Actual","period_name":"Q1 / 2013","period_final_value":17},
{"series_name":"Actual","period_name":"Q2 / 2013","period_final_value":15},
{"series_name":"Actual","period_name":"Q3 / 2013","period_final_value":13},
{"series_name":"Actual","period_name":"Q4 / 2013","period_final_value":19},
{"series_name":"Alarm","period_name":"Q1 / 2013","period_final_value":14.103},
{"series_name":"Alarm","period_name":"Q2 / 2013","period_final_value":14.404499999999999},
{"series_name":"Alarm","period_name":"Q3 / 2013","period_final_value":14.966999999999999},
{"series_name":"Alarm","period_name":"Q4 / 2013","period_final_value":50},
{"series_name":"Target","period_name":"Q1 / 2013","period_final_value":15.67},
{"series_name":"Target","period_name":"Q2 / 2013","period_final_value":16.005},
{"series_name":"Target","period_name":"Q3 / 2013","period_final_value":16.63},
{"series_name":"Target","period_name":"Q4 / 2013","period_final_value":100}]
文件渲染,但数据没有显示在图表上,只有getJSON方法外的警报工作,内部一个不起作用,相同的代码如果我尝试从html页面运行然后它工作正常,但现在我已经编写了整个代码,因为它在ASP.NET Web应用程序中的VS中,我在javascript中调用body onLoad上的loadJson函数,如下所示,
<body onload="loadJson();">
但该方法没有运行,无法解决这个问题,任何帮助都将不胜感激...
----------额外的工作------
当我在getJSON方法之上的任何变量中添加我的JSON数据并消除getJSON方法并访问时,我得到了正确的图,但是当我使用getJSON方法时,它不起作用
-----错误检查----------
我检查了chrome中的错误并且我知道它无法获取json文件,我将JSON文件保存在项目文件夹中,然后我也尝试将json文件保存在localhost中,仍然是它说同样的错误..
现在我在想我正面临着使用aspx页面进行mime类型处理的问题..它与它有什么联系.. ??
文件调用有错误吗?
尝试以下方法:
$.getJSON(url)
.done(function(data) {
alert("INSIDE FUNCTION")
})
.fail(function(jqXHR, textStatus) {
alert("Request failed: " + textStatus);
});
我主要为所有jquery ajax(和包装器)调用使用这种编码风格,这样如果请求失败,我可以给用户一个响应。
1)确保您使用的是有效的json: www.jsonlint.com
2)在localhost上运行json文件。 如果您在浏览器上看到json文件在localhost上运行,请告诉我。 确保在web.config中有此功能
<system.webServer>
<staticContent>
<mimeMap fileExtension=".json" mimeType="application/json" />
</staticContent>
</system.webServer>
3)使用getJSON
函数的警报信息
$(document).ready(function () {
$.getJSON("values.json", function (data) {
$.each(data, function () {
alert(this.series_name);
});
});
});
4)当您通过这些测试时,继续构建您的jQuery代码。
使用$ .getJSON而不是$ .get之类,
$.getJSON(url, function (data) {
alert("inside JSON function");
并检查您的json
是valid
或not
(检查一个JSON tab
是有你的console
)
http://jsonlint.com/发现您的JSON存在问题
[{"series_name":"Actual","period_name":"Q1 / 2013","period_final_value":17},
{"series_name":"Actual","period_name":"Q2 / 2013","period_final_value":15},
{"series_name":"Actual","period_name":"Q3 / 2013","period_final_value":13},
{"series_name":"Actual","period_name":"Q4 / 2013","period_final_value":19},]
它不是一个有效的JSON因为,
就在之前]
支架。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.