如何在span上获取表td值，然后单击删除该行

How to get Table td value on span click after that remove that row

本文关键字：然后 单击 删除 td span 获取      更新时间：2023-09-26

我有一个表，当我单击span时，单元格中有span。它显示最接近的TR，第二个TD值，然后删除该行。

演示

我试过了，但没有工作。。。

<table id="Table_">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td><span class="abc">click me</span></td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td><span class="äbc">click me</span></td>
    </tr>
    <tr>
         <td>7</td>
        <td>8</td>
        <td>9</td>
        <td><span class="abc">click me</span></td>
    </tr>
    <tr>
        <td>10</td>
        <td>11</td>
        <td>12</td>
        <td><span class="abc">click me</span></td>
    </tr>
</table>
$('#Table_ .abc ').click(function() {
 alert($(this).closest("tr").children("td").eq(2).html());
    $(this).closest("tr").remove();
});

这样的东西应该可以工作：）

$('#Table_ .abc').click(function() {
  alert($(this).closest("tr").children("td").eq(1).html());
  $(this).closest("tr").remove();
});
table {
  border: 1px solid black;
  border-collapse: collapse
}
table tr td {
  border: 1px solid black;
  padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="Table_">
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td><span class="abc">click me</span>
    </td>
  </tr>
  <tr>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td><span class="abc">click me</span>
    </td>
  </tr>
  <tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
    <td><span class="abc">click me</span>
    </td>
  </tr>
  <tr>
    <td>10</td>
    <td>11</td>
    <td>12</td>
    <td><span class="abc">click me</span>
    </td>
  </tr>
</table>

问题出在HTML中，字符的编写方式很奇怪。它应该是一个insted ofä。

更新的jQuery代码：

$('.abc').click(function() {
 alert($(this).closest("tr").children("td").eq(2).html());
    $(this).closest("tr").remove();
});

请检查这个小提琴

注意ä上的两个点。将a替换为ä时，代码是正确的。

$('#Table_ span.äbc ').click(function() {
   alert($(this).closest("tr").children("td").eq(2).html());
   $(this).closest("tr").remove();
});
相关文章：