根据ul li click从JSON中提取元素

Question

在ajax调用中，我需要获取JSON对象的参数值作为响应，但是我不知道该怎么做。

如果这是我在其中复制JSON结构的PHP文件

echo " { ";
echo '"general" : {';
echo '"obj" : [
    {"name" : "Primo", "description" : "Descrizione associata alla prima voce"},
    {"name" : "Secondo", "description" : "Descrizione associata alla seconda voce"},
    {"name" : "Terzo", "description" : "Descrizione associata alla terza voce"}
]}}';

这是我的HTML文件

$(document).ready(function(e) {
    $('#name li').click(function() {
        var name = $(this).text();
        url = "example.php?name=" + name;
        $.getJSON(url,
            function(json) {
                //for (i = 0; i < json.general.obj.length; i++) {
                //output = "<tr>";
                output = "<td>" + json.general.obj[0].name + "</td>";
                output += "<td>" + json.general.obj[0].description + "</td>";
                //output += "</tr><br/>";

                console.log(output);

                $("#response").append(output);
                //}
            });
        }); 
    });

<ul id="name">
    <li data-id="1">Primo</li>
    <li data-id="2">Secondo</li>
    <li data-id="3">Terzo</li>
</ul>   

<div id="response">
    <!--Data goes here-->
</div>  

哪个正确的方法去？ 我需要在哪里放置$_REQUEST['name']变量以接收作为响应的所需“描述”值？

我被困在那里

Answer 1

您可以使用data-id通过其索引检索数组的特定项目，如下所示：

$('#name li').click(function() {
    var name = $(this).text();
    var index = $(this).data('id') -1;
    var url = "example.php?name=" + name;

    $.getJSON(url, function(json) {
        output = "<p>" + json.general.obj[index].name + "</p>";
        output += "<p>" + json.general.obj[index].description + "</p>";
        $("#response").append(output);
    }); 
});

小提琴的例子

请注意，我将output td更改为p因为td元素仅在表中有效。

另外，如果只希望显示最后单击的元素的数据（而不是每次都添加新的集合），则可以使用：

$("#response").html(output);