JQuery异步加载表格选择记录

以下是一个使用jQuery异步加载表格中选定记录的简化示例代码：

HTML 部分：

<table id="records-table">
  <thead>
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>Age</th>
    </tr>
  </thead>
  <tbody>
    <!-- 记录将被加载到这里 -->
  </tbody>
</table>

JavaScript 部分（使用 jQuery）:

$(document).ready(function() {
  // 假设有一个异步的API可以获取数据
  function fetchRecords(callback) {
    $.ajax({
      url: 'your-api-endpoint', // 替换为你的API端点
      type: 'GET',
      dataType: 'json',
      success: function(data) {
        callback(data);
      },
      error: function(error) {
        console.error('Error fetching records:', error);
      }
    });
  }
 
  // 获取数据并填充表格
  fetchRecords(function(records) {
    var rows = '';
    $.each(records, function(index, record) {
      rows += '<tr>' +
                '<td>' + record.id + '</td>' +
                '<td>' + record.name + '</td>' +
                '<td>' + record.age + '</td>' +
             '</tr>';
    });
    $('#records-table tbody').html(rows);
  });
});

这段代码首先定义了一个异步获取记录的函数 fetchRecords，它通过 AJAX 调用一个 API 端点。然后在文档加载完成后，使用这个函数获取记录并通过 $.each 遍历它们，构建表格行并使用 .html() 方法将它们插入到表格的 tbody 中。