如何使用Javascript解析json并在下拉按钮中显示数据?

时间:2013-04-01 16:22:32

标签: javascript jquery html json

我有一个看起来像这样的JSON结构

[
   {
      "term_id":"28",
      "name":"Audi",
      "slug":"audi",
      "term_group":"0"
   }
]

在我的HTML页面中,我有一个下拉按钮,我想在点击后显示名称。为此,我有一些Javascript代码,如下所示:

var serviceURL = "http://www.dohamark.com/samudra/";

var make;

$('#make1').bind('pageinit', function(event) {
    getEmployeeList();
});

function getEmployeeList() {
    $.getJSON(serviceURL + '1st.php', function(data) {
        $.each(data, function(index, employee) {
            $('#make1').append('<option>' + employee.name + '</option>');
        });
    });
}

但是,此脚本在下拉按钮单击中不显示任何内容,只显示空白处。我是JavaScript的新手,并不了解JSON解析。有人可以帮我找出错误吗?

4 个答案:

答案 0 :(得分:2)

试试这个:

$.each(data, function (index, employee) {
    $('#make1').append('<option>' + employee.name + '</option>');
});

小提琴:http://jsfiddle.net/KYtph/2/

你的代码很好。确保它不像其他人建议的那样跨域,并且它被正确解析为json。

答案 1 :(得分:2)

这个怎么样:

for (var index in employee) {
    $('#make1').append($('<option>').text(employee[index].name));
});

如果我正确地阅读你的问题,我认为应该这样做。

编辑 - 为了确保OP清楚,当我在employee循环中使用变量for in时,应该引用的是JSON返回。

答案 2 :(得分:0)

我会这样写:

$.each(data, function () {
    $('#make1').append('<option>' + this.name + '</option>');
});

另外,@迈克·布莱恩特提出了一个很好的观点;如果你要跨域,那么如果没有像JSON-P这样的东西,这将无法工作。

答案 3 :(得分:0)

请尝试以下代码:

    var dd = $("#make1");

    $(dd).empty();
    $(dd).append($('<option />').attr('value', '-1').text('-----Select----'));
     $.each(data, function(index, employee) {
        dd.append($('<option />').attr('Value',employee.ID).text(employee.Name));
    });