2

我有一个从数据库解析的 JSON 数组。

$.getJSON(… ,

数据被迭代,$.each然后按名称放入 table1。

function(geojson) {
    $.each(geojson.features, function(i, feature) {
        var id = feature.properties.id;
        var name = feature.properties.name;
        var otherDetails = feature.properties.otherDetails;

        // Populate table1 with clickable links
        $("#table1 table").append('<tr><td><a href="#" onclick="['+id+']; return false;">'+name+'</a></td></tr>')
            //populate table2 with name
            .click(function(){
                $("#table2 table").append('<tr><td><a">'+name+' '+otherDetails+'</a></td></tr>')
        })
    });
});

这一切都很棒,正是我想要的。表中的每个功能“名称”都是可单击的,我希望在单击时另一个表(table2)仅填充一条记录的“名称”和“其他详细信息”。上面的代码几乎让我到了那里,但打算用单击的功能名称填充 table2,它用几乎是 table1 的副本的完整功能数组填充 table2,我认为因为它仍然在$.each. 如何停止嵌套追加中的 .each 迭代?提前致谢。

4

2 回答 2

1

事件click处理程序在级别上得到应用table,如此反复。尝试将其应用于行,如下所示:

 // Populate table1 with clickable links
 var newRow = $('<tr><td><a href="#" onclick="['+id+']; return false;">'+name+'</a></td></tr>');
 $("#table1 table").append(newRow);
 $(newRow).click(function(){
     $("#table2 table").append('<tr><td><a">'+name+' '+otherDetails+'</a></td></tr>')
 });
于 2012-10-13T19:12:45.953 回答
0

将单击处理程序添加到 table1 的行。单击时,拉出名称以放入 table2 的新行中。

$('#table1 table').on('click', 'tr', function()
{
    var name = $(this).find('a').text();
    $('#table2 table').append('<tr><td><a">' + name + '</a></td></tr>');
});

维护数据的另一种方法是使用数据属性。这也将允许您使用 otherinfo 数据。

于 2012-10-13T19:12:04.817 回答