Question

我正在尝试使用我的JSON文件中的数据动态填充页面我收到此错误

"Uncaught Syntax Error: Unexpected Token :" on line 2.

所以这里是我的json文件，还有更多内容，但我不想发布整个文件。

{
"jobs": [
    {
        "title": "Graduate IT Development Programme #1",
        "path": "/path/to/job",
        "type": "Graduate job",
        "location": [
            "North West",
            "North East"
        ],
        "closingDate": "20/05/2014",
        "continuous": false,
        "skills": [
            "HTML",
            "CSS",
            "JavaScript",
            "Java",
            "CI",
            "Testing"
        ],
        "contract": "Permanent",
        "salary": {
            "lower": 14501,
            "upper": 17000,
            "currency": "£"
        },
        "employer": {
            "name": "Mercer",
            "href": "/path/to/employer",
            "logo": "img/mercer-logo.png"
        }
    },
    {
        "title": "Web Developer",
        "path": "/path/to/job",
        "type": "Graduate job",
        "location": ["Greater London"],
        "continuous": true,
        "skills": [
            "HTML",
            "CSS",
            "JavaScript"
        ],
        "salary": {
            "lower": 16000,
            "upper": 21000,
            "currency": "€"
        },
        "employer": {
            "name": "FDM plc",
            "href": "/path/to/employer",
            "logo": "img/fdm-logo.png"
        }
    },
    {
        "title": "Front-end Web Developer",
        "path": "/path/to/job",
        "type": "Graduate scheme",
        "location": ["Greater London"],
        "closingDate": "20/04/2014",
        "continuous": false,
        "skills": [
            "HTML",
            "CSS",
            "Java",
            "Testing"
        ],
        "salary": {
            "lower": 17001,
            "upper": 19500,
            "currency": "£"
        },
        "employer": {
            "name": "British Airways plc",
            "href": "/path/to/employer",
            "logo": "img/british-airways-logo.png"
        }
    }
    ]
}

这是我的.getJSON函数（document.write只是暂时的，直到它正常工作）

$(document).ready(function() {
     $.getJSON( 'js/jobs.json',function( result ){
        document.write(result.jobs.title);
     });
});

所以我不确定问题是什么。看了其他问题和其他解决方案后，我感觉比以前更加困惑。

Answer 1

尝试使用stringify，如下所示

$(document).ready(function() {
        $.getJSON( 'js/jobs.json',function( result ){
            var jsonString = JSON.stringify(result);
            var result = JSON.parse(jsonString);
            console.log(result); 
            //document.write(result.jobs.title);
        });
});

希望这可以帮助你。

Answer 2

如果查看了json结构，jobs是一个对象数组。因此无法直接访问title。你应该通过索引得到它，例如。

$(document).ready(function () {
    $.getJSON('js/jobs.json', function (result) {
        // in case the result is not in json data type
        // otherwise not necessary
        result = JSON.parse(result); 
        result.jobs.map(function (v) {
            console.log(v.title);
            document.write(v.title);
        });        
    });
});

DEMO

EDITED DEMO

Answer 3

如果在删除该AJAX调用后出现错误，则该问题实际上可能在您尝试包含诸如

之类的内容的某个HTML页面中

<script src="js/myJsonFile.json"></script>

如果是这种情况，您只需删除该行，因为您想通过AJAX调用加载文件，而不需要尝试将文件包含在标题中

未捕获的语法错误：意外的令牌：getJSON

3 个答案: