Jquery 如何分别标识动态listview行以标识已单击的行

我正在摆弄一个GoogleMap教程，其中我有一个使用JSON从数据库中动态填充值标记的地图。除此之外，我还有一个listview，其中还动态填充了来自同一数据库的每个标记的名称。当选择listview中的存储名称时，我试图平移到标记的lat和lon位置

用户在列表视图中选择麦当劳。然后，他们被平移到地图上麦当劳的标记位置

我认为listview中每一行的id应该以某种方式用于匹配数组中的lat和lon值，然后使用商店的lat和long的map.panTo函数。我是一个JSON新手，不知道该怎么做，因为它是动态的，而且都卡在一个循环中

动态listview的jQuery发布在下面

JS

getsome.php

---

你可以用这个方法。在本例中，我使用最接近的方法从Listview项中获取一些数据。在动态填充listview项时，可以插入数据属性-data where=数据-例如data address=10 maple Street data lat=45.6789 data lng=56.6786等

演示

---

真棒：我没想到会这么简单。非常感谢@Tasos

var file = "getsome.php";

$.post(file, function(data) {

var output = '';

$.each(data, function(index, value){ 

    output += '<li><a href="#" id='+ value.site_id +'" class="latlon">' + value.site_name + '</a></li>';

}); $('#listview-id').html(output).listview().listview('refresh'); }, "json");

require("dbconnect.php");

try {
  $DBH = new PDO("mysql:host=$server;dbname=$database;charset=utf8", $username, $password,
                    array(PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES 'utf8'"));
}
 catch (PDOException $e) {
    print "Error!: " . $e->getMessage() . "<br/>";
    die();
}

$STH = $DBH->prepare("SELECT * FROM Site WHERE 1");

$STH->execute();

$result = $STH->fetchAll();

echo json_encode($result);

<ul data-role="listview" id="listview">
    <li data-id="row1">Row 1</li>
    <li data-id="row2">Row 2</li>
    <li data-id="row3">Row 3</li>
    <li data-id="row4">Row 4</li>
</ul>


$("#listview").on("click", ">li", function(event, ui) {
var id = $(this).closest("li").attr('data-id');
alert(id)
});