php - 在 jQuery 函数中从 PHP 读取 JSON 数组

Question

我正在使用 this question 已接受的答案帮助我使用 jQuery 从 JSON 数组构建 HTML 选择菜单。

我的 JSON 数组是从 PHP 脚本作为 $menu 传递的，如下所示:

{ "options": [
    { "id":"7","name":"Smith, John"},
    { "id":"4","name":"Jones, Tom"}
  ]
}

首先，我构建选择菜单的框架并将其插入页面中:

var div = '<div class="row">';
var label = '<label for="employee">Employee</label>';
var select = '<select name="employee id="employee">';
var close = '</select></div>';
var menu = div + label + select + close;

$('#clicked_link').prepend(menu);

然后我尝试将 $menu 数组传递给 jQuery，如下所示:

var json = '<?php echo $menu; ?>';

然后，我尝试使用 linked question 中的示例将选项附加到新创建的选择菜单中。 :

var options = eval('(' + json + ')');
var length = options.length;

for (var j = 0; j < length; j++)
{
    var newOption = $('<option/>');
    newOption.attr('id', options[j].id);
    newOption.attr('name', options[h].name);
    $('#employee').append(newOption);
}

选择菜单按预期显示，但不包含任何选项。任何人都可以看到我在哪里犯了错误吗？提前致谢。

经过修改以纳入 Rocket 的解决方案:

var json = <?php echo $menu; ?>;

var options = json.options;
var length = options.length;

for (var j = 0; j < length; j++)
{
    var newOption = $('<option/>');
    newOption.attr('value', options[j].id);
    newOption.attr('text', options[j].name);
    $('#employee').append(newOption);
}

Answer 1

您不需要在此处使用eval，甚至不需要使用JSON.parse。 JSON 是有效的 JavaScript 代码。你可以这样做:

var json = <?php echo $menu; ?>;  // Note: the quotes have been removed.

这将生成以下代码:

var json = { "options": [
    { "id":"7","name":"Smith, John"},
    { "id":"4","name":"Jones, Tom"}
  ]
};

正如您所看到的，这是有效的 JavaScript 代码。

然后你可以执行var options = json.options。