Jquery.getJSON无法获取要显示的所有数据

时间:2014-03-30 20:10:17

标签: jquery json getjson

所以我通常对JSON很新,并且我开始对该文件有一个合理的理解。我试图用我的JSON文件使用.getJSON填充我的网页数据,我已经设法用一大堆信息填充页面。但是我很难挣扎 a:获取填充页面的其他信息 b:同时显示所有数据。

这是getjson函数:

$(document).ready(function () {
    $.getJSON('js/jobs.json', function (result) {
        result.jobs.map(function (v) {
            $('#title').html(v.title);
            $('#info1').html(v.path +' '+ v.type + ' ' + v.location + ' ' + v.closingDate + ' ' + v.skills);
            $('#info2').html(v.salary.lower +' '+  v.salary.upper + ' '+ v.employer.name + ' ' + v.employer.href + ' ' + v.employer.logo);

        }); 
    });
});

我所知道的可能相当粗略,但我会解决这个问题。

这是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"
            }
        }
    ]
}

我得到的输出是显示最后一个数据数组(标题为"前端开发人员")我有一切显示,但我很难获得其他数据数组为了显示,我已经创建了一个单独的功能并且非常难以编码,我仍然无法使其工作。

1 个答案:

答案 0 :(得分:0)

.html()替换当前内容。请改用.append()