使用Ajax从外部文件调用JSON数据

I'm calling a external JS file having some sample JSON code, when I try to put sample json code in the file, it throws me error at ":", but when I validate that using online tools, it says as valid json. What is going wrong in this code?

我正在调用一个带有一些示例JSON代码的外部JS文件,当我尝试将示例json代码放入文件时,它会在“:”处抛出错误,但是当我使用在线工具验证时,它表示为有效的json。这段代码出了什么问题?

Here is my code

这是我的代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>


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

    $('#click').click(function() {
        $.ajax({
            url: "json.js",
            method: "GET",
            dataType: 'application/json',
            contentType: "application/json",
             success: function(result){
                  console.log(result);
             },
             error:function() {
                 alert("Error")                  
             }
        });
    });
});
</script>

My external json.js

我的外部json.js

{
"data": [{      ------> throwing error at ":" as Syntax error on token ":", ; expected
    "Service": "INSTACC",

    "Create Date": "30-Jul-2016"


}, {
    "Service": "INSTACC",

    "Create Date": "30-Jul-2016"


}]

}

2 个解决方案

#1

Change your file type to json and dataType to "json"

将文件类型更改为json,将dataType更改为“json”

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  <script>
$(document).ready(function() {

    $('#click').click(function() {
        $.ajax({
            url: "json.json",
            method: "GET",
            dataType: 'json',
             success: function(result){
                  console.log(result);
             },
             error:function() {
                 alert("Error")                  
             }
        });
    });
});
</script>

#2

"application/json" is not a valid value for the dataType property. Change it to dataType: 'json',

“application / json”不是dataType属性的有效值。将其更改为dataType:'json',

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MyDemo</title>
</head>
<body>
<button id="click">Click Me</button>

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
    $(document).ready(function() {

        $('#click').click(function() {
            $.ajax({
                url: "json.js",
                method: "GET",
                dataType: 'json',
                contentType: "application/json",
                success: function(result){
                    console.log(result);
                },
                error:function(req, status, err) {
                    console.log(req);
                    console.log(status);
                    console.log(err);
                }
            });
        });
    });
</script>
</body>
</html>

#1