[英]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.