Question

我想用这样的结构构建通用表：

<table>
  <tr>
    <td>Lastname: Becker</td>
    <td>Firstname: Mirjam</td>
    <td>Compnany: bla</td>
    <td>Contry: Belgium</td>
    <td>
      <img height="49" width="37" src="style/user.jpg" />
    </td>
    <td>
      <a href="userprofile.html">
        <img height="31" width="36" src="style/lupe.jpg" />
      </a>
    </td>
  </tr>
</table>

我有功能，但不起作用：

function createTableWithUserData() {
  cloud.getUsers("46daed956").then(function(userDetails) {
    var users = $('');
    $.each(steps.steps, function (i, s) {
      var element = $('<td>' + userDetails.lastName + '</td>' +
                      '<td>' + userDetails.firstName + '</td>' +
                      '<td>' + userDetails.Company + '</td>');
      users.append(element);
  });
}

Answer 1

$('');不是表格，请改用<{1}}
您没有将表格添加到文档中，而是将其分离。循环后使用$('<table>');附加。
也添加TR。
添加另一个}。

请改为尝试：

$('body').append(users);

Answer 2

使用模板尝试：

<script id="userTemplate" type="text/x-jquery-tmpl">
  <table>
    <tr>
      <td>Lastname: ${lastName}</td>
      <td>Firstname: ${firstName}</td>
      <td>Compnany: ${Company}</td>
      <td>Contry: ${Country}</td>
      <td>
        <img height="49" width="37" src="style/user.jpg" />
      </td>
      <td>
        <a href="userprofile.html">
          <img height="31" width="36" src="style/lupe.jpg" />
        </a>
      </td>
    </tr>
  </table>
</script>

<script type="text/javascript">
  cloud.getUsers("46daed956").then($.proxy($.tmpl))
</script>

如何使用jQuery构建通用表？

2 个答案: