Question

当数量更改为零时，我试图验证购物车，因为当html等于零时，我基本上隐藏了减号图标，每当我的购物车中有一件商品时，它就会起作用，但是当我的购物车中有一件商品时，它就会停止工作有多个项目，有人知道这是为什么吗？

在我的刀片文件中，每个项目都有这个

<td data-th="Quantity">
  <i class="fa fa-minus-circle" data-id="{{$id}}"></i> <span class="quantity-val quantity-{{$id}}">{{ $details['quantity'] }} </span> <i class="fa fa-plus-circle" data-id="{{$id}}"></i> 
</td>

在我的JS文件中，我具有此功能

$(document).ready(function () {
            initialQuantity = $('.quantity-val').text();

            if(initialQuantity == 0){
                $(".fa-minus-circle").hide();
            }

        });

有人知道为什么吗？

Answer 1

您应该使用.each()遍历每个对应的单元格，并使用.siblings()来获取相应的“减号”图标：

$(document).ready(function() {
  $('.quantity-val').each(function() {
    var initialQuantity = parseInt($(this).text());
    if (initialQuantity === 0) {
      $(this).siblings('.fa-minus-circle').hide();
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

<table>
  <tr>
    <td data-th="Quantity">
      <i class="fa fa-minus-circle" data-id="1"></i> <span class="quantity-val quantity-1">10</span> <i class="fa fa-plus-circle" data-id="1"></i>
    </td>
  </tr>
  <tr>
    <td data-th="Quantity">
      <i class="fa fa-minus-circle" data-id="2"></i> <span class="quantity-val quantity-1">0</span> <i class="fa fa-plus-circle" data-id="2"></i>
    </td>
  </tr>
</table>

jQuery Function在有多个目标时停止工作，但在有一个目标时工作

1 个答案: