Question

我有桌子，我正在使用数据表，我有这样的行：

<tr id="tr.12" data-id="12" role="row" class="odd">
    <td class="sorting_1">Ana O</td>
    <td>ana@mail.com</td>
    <td>2017-02-15 15:54:23</td>
    <td>Active</td>
    <td>User</td>
    <td style="padding-left:3px">
        <a href="#" class="btn-delete" data-toggle="tooltip" title="Delete!">
          <i class="fa fa-trash-o" aria-hidden="true"></i>
       </a>
       <a href="#" class="btn-update" data-toggle="tooltip" title="Edit!">
          <i class="fa fa-pencil" aria-hidden="true"></i>
       </a>
       <a href="#" data-toggle="tooltip" title="View details!">
          <i class="fa fa-eye" aria-hidden="true"></i>
       </a>
  </td>

然后，我正在尝试通过ID获取行，并修改例如第一列，如下所示：

$("#tr.12 td:nth-child(1)").text("new name");

但在我尝试删除行（再次基于id）之前没有任何变化，但它无法正常工作。那么，我错过了什么？

Answer 1

您需要转义ID中的.，因为选择器中的.意味着要查找某个类。

＆＃13;

$("#tr\\.12 td:nth-child(1)").text("new name");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr id="tr.12" data-id="12" role="row" class="odd">
    <td class="sorting_1">Ana O</td>
    <td>ana@mail.com</td>
    <td>2017-02-15 15:54:23</td>
    <td>Active</td>
    <td>User</td>
    <td style="padding-left:3px">
      <a href="#" class="btn-delete" data-toggle="tooltip" title="Delete!">
        <i class="fa fa-trash-o" aria-hidden="true"></i>
      </a>
      <a href="#" class="btn-update" data-toggle="tooltip" title="Edit!">
        <i class="fa fa-pencil" aria-hidden="true"></i>
      </a>
      <a href="#" data-toggle="tooltip" title="View details!">
        <i class="fa fa-eye" aria-hidden="true"></i>
      </a>
    </td>
  </tr>
</table>

＆＃13;

或者，不要在ID中使用CSS选择器中具有特殊含义的字符。

使用JQuery基于行ID修改列

1 个答案: