要隐藏包含零的表行(以qty计)

Question

​

​

希望在qty列中隐藏包含Zero的表行。我对项目进行了硬编码，数量值来自另一种形式的$post。希望使用java脚本或jquery隐藏它。

Answer 1

使用jQuery .filter()和.closest()方法，如下所示：

​

$('.table input').filter(function() { return +this.value === 0; }).closest("tr").hide()

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table">
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="2">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="0">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="8">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="78">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="0">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input type="text" name="somename" value="0">
    </td>
  </tr>
</table>

​

Answer 2

假设您的输入有一个带有class="qty"的value="0"类

[value="0"]

• Than

• 使用属性选择器[]匹配所有具有.closest()

遍历的输入到使用.closest()的祖先

​

$('.qty[value="0"]').closest("tr").hide()

<table>
  <tr>
    <td>
      Qty: <input class="qty" type="text" value="0">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input class="qty" type="text" value="4">
    </td>
  </tr>
  <tr>
    <td>
      Qty: <input class="qty" type="text" value="0">
    </td>
  </tr>
</table>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

​

Answer 3

$("td").each(function(){
   var storeData = $("input").val();
   if(storeData == 0){
      $(this).parent().hide();
   }
  });