时间戳

首页 > 解决方案 > 使用 jquery 读取表值

javascript - 使用 jquery 读取表值

问题描述

早上好，我想尝试在表数据中使用 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

标签： javascriptjquerydom-events

解决方案

ID对于 HTML DOM 树必须是唯一的。
对于经常使用，我建议改用类。

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

在比较等价=时分配一个值。==

您需要从单击的元素遍历.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>

推荐阅读