Question

我有一个由jquery生成的表。

<table id="redTable" class="rwd-table table-centered">
  <thead>
    <tr>
      <th>aaa</th>
      <th>bbb</th>
      <th>ccc</th>
      <th>ddd</th>
      <th>eee</th>
      <th>fff</th>
    </tr>
  </thead>
  <tbody>

    <tr id="46603693">
      <td><span>Image cell</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
    </tr>
    <tr id="30041170">
      <td><span>Image cell</span></td>
      <td><span>Change it to Image</span></td>
      <td><span>Loading</span></td>
      <td><span>Change it to 10</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
    </tr>
  </tbody>
</table>

我想搜索id等于30041170的行; 比我想改变细胞值。我试过了$('#id').find('30041170')。也许我得到了这一行。

很好吗？如果没问题，我该如何改变细胞？

对不起，我是前端jq的新手，对我来说太难了。我希望有一个人可以帮助我。非常感谢！

Answer 1

$('#30041170 td span').eq(1).html('Image');
$('#30041170 td span').eq(3).html('10');

Answer 2

我尝试了$('#id').find('30041170')

不，这会引发错误，您尝试将数字用作标记选择器。

如果可以，请更改生成表格的代码，将字母放在这些数字ID的前面，例如id="x30041170"而不是id="30041170"。然后使用$("#x30041170")获取行。

如果您不能，可以使用$("#redTable [id='30041170'])获取该行。（如果你使用$("#30041170")它可以使用当前版本的jQuery，但它是一个无效的选择器，并不能保证。）

如果您拥有该行的选择器，则可以添加该行以通过:eq选择特定单元格及其中的范围。例如，要将第三个单元格的span内容设置为＆＃34; 10＆＃34;：

$("#redTable [id='30041170'] > td:eq(2) span").text("10");

或获取行：

var row = $("#redTable [id='30041170']);

...然后解决其中的单元格：

row.children().eq(2).find("span").text("10");

直播示例：

＆＃13;

$("#button").click(function() {
  $("#redTable [id='30041170'] > td:eq(2) span").text("10");
});

＆＃13;

<input type="button" id="button" value="Click To Change">
<table id="redTable" class="rwd-table table-centered">
  <thead>
    <tr>
      <th>aaa</th>
      <th>bbb</th>
      <th>ccc</th>
      <th>ddd</th>
      <th>eee</th>
      <th>fff</th>
    </tr>
  </thead>
  <tbody>

    <tr id="46603693">
      <td><span>Image cell</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
    </tr>
    <tr id="30041170">
      <td><span>Image cell</span></td>
      <td><span>Change it to Image</span></td>
      <td><span>Loading</span></td>
      <td><span>Change it to 10</span></td>
      <td><span>Loading</span></td>
      <td><span>Loading</span></td>
    </tr>
  </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 3

尝试以下摘录。

E1

//To change all the td values 
$('#30041170 > td > span').html("new image");

//To change first td value
$('#30041170 > td:eq(0) > span').html("first td");

//To change last td value
$('#30041170 > td:last() > span').html("last td");

如何通过id获取表行，然后更改它的值/ html

3 个答案: