根據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);