javascript - 如何在javascript中使单元格表的href链接可点击？

Question

我有一个表格来显示我的 API 中的所有数据。我的代码如下所示：

<div class="table-responsive">
        <h1>List Existing Node</h1>
        <br/>
        <table class="table table-bordered table-striped" id="node_table">
            <tr>
                <th>Node Id</th>
                <th>Latitude</th>
                <th>Longitude</th>
                <th>Location</th>
            </tr>
        </table>
    </div>
<script>
    $(document).ready(function() {
        $.getJSON("/api/node/", function(data){
            var node_data = '';
            $.each(data, function(key, value){
                node_data += '<tr>';
                node_data += '<td>'+value.node_id;
                node_data += '<td>'+value.latitude;
                node_data += '<td>'+value.longitude;
                node_data += '<td>'+value.location;
                node_data += '</tr>';
            });
            $('#node_table').append(node_data);
            console.log(data);

        });
    });<script>

问题是我希望节点 ID 列中的所有单元格表都可以使用 href 链接单击。

例如，当我单击节点 ID 列中的单元格（例如：节点 1 或节点 2 或节点 n）时，页面将被重定向到https://facebook.com

我怎样才能做到这一点？

标签： javascripthtmlhref

Answer 1

$('#node_table').on('click', 'tr', function() {
    var href = $(this).data('href');
    window.location.href = href;
})

$.getJSON("/api/node/", function(data){
    var node_data = '';
    $.each(data, function(key, value){
        node_data += '<tr data-href="your link here">';
        node_data += '<td>'+value.node_id;
        node_data += '<td>'+value.latitude;
        node_data += '<td>'+value.longitude;
        node_data += '<td>'+value.location;
        node_data += '</tr>';
    });
    $('#node_table').append(node_data);
    console.log(data);

});