未捕獲的TypeError：無法讀取未定義的Morris.js的屬性'x'

Question

我瘋了，我不知道是什么導致了這個錯誤。

我的Javascript：

<script>
$(document).ready(function() {


        var jqxhr = $.getJSON("rest/scriptruns/VeloxMorgana", function() {
            //VeloxMorgana.setData('[{"period":"2014-07-15","VeloxMorgana":1},{"period":"2014-07-16","VeloxMorgana":47}]');
        });

        jqxhr.complete(function() {
            if ($('#VeloxMorgana').length) {
                var week_data = jqxhr;
                var VeloxMorgana = Morris.Line({
                    element : 'VeloxMorgana',
                    data : week_data,
                    xkey : 'period',
                    ykeys : ['VeloxMorgana'],
                    labels : ['VeloxMorgana'],
                    events : ['2014-07-10', '2014-07-17']
                });
            }
        });

    });
</script>

我的HTML

<!-- Widget ID (each widget will need unique ID)-->
        <div class="jarviswidget" id="wid-id-7" data-widget-editbutton="false">
            <!-- widget options:
            usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">

            data-widget-colorbutton="false"
            data-widget-editbutton="false"
            data-widget-togglebutton="false"
            data-widget-deletebutton="false"
            data-widget-fullscreenbutton="false"
            data-widget-custombutton="false"
            data-widget-collapsed="true"
            data-widget-sortable="false"

            -->
            <header>
                <span class="widget-icon"> <i class="fa fa-bar-chart-o"></i> </span>
                <h2>Time Graph</h2>

            </header>

            <!-- widget div-->
            <div>

                <!-- widget edit box -->
                <div class="jarviswidget-editbox">
                    <!-- This area used as dropdown edit box -->

                </div>
                <!-- end widget edit box -->

                <!-- widget content -->
                <div class="widget-body no-padding">

                    <div id="VeloxMorgana" class="chart no-padding"></div>

                </div>
                <!-- end widget content -->

            </div>
            <!-- end widget div -->

        </div>
        <!-- end widget -->

當我靜態設置數據時，它就會加載，但是當我使用JSON時，它就怪胎了。

這是當我使用ajax json功能調用它並加載數據時加載的JSON（我已經嘗試過將JSON請求完成后直接放入數據中，結果相同）。

[  
   {  
      "period":"2014-07-15",
      "VeloxMorgana":1
   },
   {  
      "period":"2014-07-16",
      "VeloxMorgana":47
   }
]

Answer 1

jqxhr只是XHR請求的jqxhr對象，它實際上不包含接收到的數據。

由於您根本不真正處理失敗，因此我建議您立即使用成功回調：

$.getJSON("rest/scriptruns/VeloxMorgana", function(data) {
    if ($('#VeloxMorgana').length) {
        Morris.Line({
            element : 'VeloxMorgana',
            data : data,
            xkey : 'period',
            ykeys : ['VeloxMorgana'],
            labels : ['VeloxMorgana'],
            events : ['2014-07-10', '2014-07-17']
        });
    }
});

此外， 文檔指出：

jQuery 1.5中不推薦使用jqXHR.success() ， jqXHR.error()和jqXHR.complete()回調方法。