0

下面是我的代码，其中 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 方法并访问它时，我会正确获得 Graph 但是当我使用 getJSON 方法时，它就不起作用

------错误检查---------

我检查了 chrome 中的错误，我知道它无法获取 json 文件，我将 JSON 文件保存在项目文件夹中，然后我也尝试将 json 文件保存在 localhost 中，仍然说同样的错误..

现在我在想我在使用 aspx 页面处理 mime 类型时遇到了问题。有什么可以与之链接的吗？？

4

4 回答 4

2

1) 确保您使用的是有效的 json： www.jsonlint.com

2）在本地主机上运行您的 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 代码。

于 2013-11-14T15:06:22.680 回答
1

文件调用有什么错误吗？

尝试以下操作：

$.getJSON(url)
  .done(function(data) {
    alert("INSIDE FUNCTION")
  })
  .fail(function(jqXHR, textStatus) {
    alert("Request failed: " + textStatus);
  });

我主要将这种编码风格用于所有 jquery ajax（和包装器）调用，以便在请求失败时给用户一个响应。

于 2013-11-14T11:21:08.553 回答
0

使用$.getJSON而不是$.get之类的，

 $.getJSON(url, function (data) {
    alert("inside JSON function");

并检查您的jsonisvalid或not（检查 aJSON tab是否在您的console）

于 2013-11-14T11:16:16.430 回答
0

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 。]

于 2013-11-14T11:27:04.637 回答