Javascript/JSON錯誤：TypeError：myObj未定義

Question

我想用數據庫中的數據創建圖表。我創建了一個PHP文件將數據放入多維數組中。該數組包含四個數組，每個數組都有五個值。最後，我在PHP的json_encode（）方法中回顯多維數組。

用我的Javascript文件我想獲取JSON，但它是不完整的。我得到多維數組的第一個數組和第二個數組的第一個值。

console.log（）告訴我第12行中有一個「TypeError：myObj未定義」的錯誤，但我在腳本中找不到錯誤。

這是我的javascript：

window.onload=function(){ 
 
    var xmlhttp = new XMLHttpRequest(); 
 

 
    xmlhttp.onreadystatechange = function() { 
 
     if (this.readyState == 4 && this.status == 200) { 
 
      var myObj = JSON.parse(this.responseText); 
 
     } 
 

 
     var ctx = document.getElementById("overviewChart"); 
 

 
     var data = { 
 
      labels: [myObj[0][0], myObj[0][1], myObj[0][2], myObj[0][3], myObj[0][4]], 
 
      datasets: [ 
 
       { 
 
        backgroundColor: "rgba(255, 120, 42, 0.7)", 
 
        hoverBackgroundColor: "rgba(255, 120, 42, 1)", 
 
        borderColor: "rgba(255, 120, 42, 0.9)", 
 
        borderWidth: 3, 
 
        label : "Offen", 
 
        data: [myObj[1][0], myObj[1][1], myObj[1][2], myObj[1][3], myObj[1][4]] 
 
       }, 
 
       { 
 
        backgroundColor: "rgba(50, 255, 50, 0.7)", 
 
        hoverBackgroundColor: "rgba(50, 255, 50, 1)", 
 
        borderColor: "rgba(50, 255, 50, 0.9)", 
 
        borderWidth: 3, 
 
        label: "Bestätigt", 
 
        data: [myObj[2][0], myObj[2][1], myObj[2][2], myObj[2][3], myObj[2][4]] 
 
       }, 
 
       { 
 
        backgroundColor: "rgba(255, 30, 30, 0.8)", 
 
        hoverBackgroundColor: "rgba(255, 30, 30, 1)", 
 
        borderColor: "rgba(255, 30, 30, 0.9)", 
 
        borderWidth: 3, 
 
        label : "Storniert", 
 
        data: [myObj[3][0], myObj[3][1], myObj[3][2], myObj[3][3], myObj[3][4]] 
 
       } 
 
      ] 
 
     }; 
 
    } 
 
}

Answer 1

您只需將您的MyObj中變量時this.readyState == 4 & & this.status == 200：

if (this.readyState == 4 && this.status == 200) { 
    var myObj = JSON.parse(this.responseText); 
} 

但是，xmlhttp.onreadystatechange函數的其餘部分仍然會爲其他readyState va運行lues，在這些情況下，myObj將是未定義的。

因此，整個函數體應該是如果條件中：

xmlhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     var myObj = JSON.parse(this.responseText); 

     var ctx = document.getElementById("overviewChart"); 

     var data = { 
      labels: [myObj[0][0], myObj[0][1], myObj[0][2], myObj[0][3], myObj[0][4]], 
      datasets: [ 
       { 
        backgroundColor: "rgba(255, 120, 42, 0.7)", 
        hoverBackgroundColor: "rgba(255, 120, 42, 1)", 
        borderColor: "rgba(255, 120, 42, 0.9)", 
        borderWidth: 3, 
        label : "Offen", 
        data: [myObj[1][0], myObj[1][1], myObj[1][2], myObj[1][3], myObj[1][4]] 
       }, 
       { 
        backgroundColor: "rgba(50, 255, 50, 0.7)", 
        hoverBackgroundColor: "rgba(50, 255, 50, 1)", 
        borderColor: "rgba(50, 255, 50, 0.9)", 
        borderWidth: 3, 
        label: "Bestätigt", 
        data: [myObj[2][0], myObj[2][1], myObj[2][2], myObj[2][3], myObj[2][4]] 
       }, 
       { 
        backgroundColor: "rgba(255, 30, 30, 0.8)", 
        hoverBackgroundColor: "rgba(255, 30, 30, 1)", 
        borderColor: "rgba(255, 30, 30, 0.9)", 
        borderWidth: 3, 
        label : "Storniert", 
        data: [myObj[3][0], myObj[3][1], myObj[3][2], myObj[3][3], myObj[3][4]] 
       } 
      ] 
     } 
    } 
};