從文本文件加載jsondata時的空白頁

我想從包含json-data的html文件加載名稱。問題是該頁面是空白/白色的，並且在Firefox調試器中沒有錯誤消息。從文本文件加載jsondata時的空白頁

test.html和persondb.html位於同一臺服務器上。

的test.html

<!DOCTYPE html> 
<html> 
<head lang="en"> 
<meta charset="UTF-8"> 
<title>JSON Exempel</title> 
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> 
</head> 
<body> 

<ul id="person-lista"> 

</ul> 

<script> 

$.ajax({ 
    url: "http://www.mywebbpage.com/ajax/persondb.html", // not the realname 
    data: { 
     limit: 5, 
     name: 'ra' 
    }, 

    success: function (response) { 

     var personArray = response.personer; 
     for(var i=0; i < personArray.length; i++) { 
      var person = personArray[i]; 
      $('#person-lista').append('<li>' + person.fnamn + '</li>'); 
     } 
    } 
}); 

</script> 
</body> 
</html>

persondb.html

{ 
"personer": [{ 
    "fnamn": "RACHELLE", 
    "enamn": "ZWIEFELHOFER", 
    "epost": "[email protected]" 
}, { 
    "fnamn": "RACQUEL", 
    "enamn": "JOH", 
    "epost": "[email protected]" 
}, { 
    "fnamn": "RAE", 
    "enamn": "BRAVARD", 
    "epost": "[email protected]" 
}, { 
    "fnamn": "RAFAEL", 
    "enamn": "SAGASTUME", 
    "epost": "[email protected]" 
}, { 
    "fnamn": "RAISA", 
    "enamn": "REINES", 
    "epost": "[email protected]" 
}] 
}

是persondb.html格式不正確？這是原因嗎？當在瀏覽器中加載persondb.html它看起來喜歡以下

{ "personer": [{ "fnamn": "RACHELLE", "enamn": "ZWIEFELHOFER", "epost": "[email protected]" }, { "fnamn": "RACQUEL", "enamn": "JOH", "epost": "[email protected]" }, { "fnamn": "RAE", "enamn": "BRAVARD", "epost": "[email protected]" }, { "fnamn": "RAFAEL", "enamn": "SAGASTUME", "epost": "[email protected]" }, { "fnamn": "RAISA", "enamn": "REINES", "epost": "[email protected]" }] }

或者是它的「同源策略」的問題？但這些文件是在同一臺服務器上（同一文件夾）

來源

2016-05-02 java

開發者控制檯（chorme和firefox中的F12）有任何錯誤？ –

@GummaMocciaro - 完全沒有錯誤 – java

你需要分析你的JSON之前，你可以在你的循環訪問它 -

success: function (response) { 

    var res = JSON.parse(response); 
    var personArray = res.personer; 
    for(var i=0; i < personArray.length; i++) { 
     var person = personArray[i]; 
     $('#person-lista').append('<li>' + person.fnamn + '</li>'); 
    } 
}

來源

2016-05-02 15:50:27 WillardSolutions

是正確的 - 但絕對的url-string使得瀏覽器根據「同源策略」阻止請求。通過只是縮短字符串「persondb.html」它的工作 – java

你必須解析JSON，如EatPeanutButter提到的，或者你必須發送一個正確的Content-Type（application/json）與你的html頁面的響應。您的JSON格式良好。

來源

2016-05-02 15:56:49 rmacnell

從文本文件加載jsondata時的空白頁

回答

相關問題