使用 jquery 读取表值答案

【问题标题】：read tabel value using jquery使用 jquery 读取表值
【发布时间】：2021-03-04 05:16:13
【问题描述】：

早上好我想尝试在表数据中使用 jquery 隐藏图标，如果表数据值拒绝则图标隐藏。但这似乎不对

<tr>            
    <td id="status"><?php echo $row[PO_Status]; ?></td>
    <td>
        <center>
            <a id="edit" href="./page.php?page=editdatapo&id=<?php echo $row[id]; ?>">
               <button type="button" class="btn btn-default btn-sm">
                 <span class="glyphicon glyphicon-pencil"></span>
               </button>
            </a>
        </center>
    </td>
</tr>

<script>
    $("#status").each(function() {
    var status = $(this).text();
    console.log(status);
    });
if (status = 'reject'){
$("#edit").hide();
}
</script>

我有 4 td Approve,Approve,reject,reject 当我检查控制台时，它会打印 Approve,Approve,Approve,Approve

【问题讨论】：

在 HTML 中，IDs 对于 DOM 树必须是唯一的。换句话说，只有一个元素可以具有 ID“状态”。您可以尝试为每个元素使用不同的 ID，或者（更好）一个通用的class。另见Does ID have to be unique in the whole page?
我已经检查 ID 状态是 uniqe
您提到您有四个 <td> 元素。其他三个的 ID 是什么？
我的意思是我在 td id="status" 得到了 php 的结果

标签： javascript jquery dom-events

【解决方案1】：

根据 HTML 标准，您只能在页面中按时提供 id，如果多次有 1 个 id，则必须使用 find()。

<script>
    $("tr").find("#status").each(function() {
        var status = $(this).html();
        if (status == 'reject'){
            $(this).parent("tr").find("#edit").hide();
        }
    });
</script>

【讨论】：

【解决方案2】：

IDs must be unique 到 HTML DOM 树。
对于经常使用，我建议改用类。

测试status 反对“拒绝”的条件应该放在each 循环内。
您正在测试每个元素以查看其状态是否为“拒绝”。

= 分配一个值，而== compares equivalence。

您需要从单击的.status 遍历到下一个单元格中与其关联的.edit 元素。为此，我向上移动到最近的<tr>，然后在该行中搜索.edit 元素。

$('.status').each(function() {
  let $this = jQuery(this);
  let status = $this.text();
  console.log(status);
  if (status == 'reject') {
    $this.closest('tr').find('.edit').hide();
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td class="status">one</td>
      <td>
        <center>
          <a class="edit" href="./page.php?page=editdatapo&id=1">edit</a>
        </center>
      </td>
    </tr>
    <tr>
      <td class="status">reject</td>
      <td>
        <center>
          <a class="edit" href="./page.php?page=editdatapo&id=2">edit</a>
        </center>
      </td>
    </tr>
    <tr>
      <td class="status">three</td>
      <td>
        <center>
          <a class="edit" href="./page.php?page=editdatapo&id=3">edit</a>
        </center>
      </td>
    </tr>
  </tbody>
</table>

【讨论】：