jquery - jQuery Cart 商品数量和总价计算

Question

我正在尝试创建一个购物车。我有 2 个购物车物品，想用按钮增加/减少数量并计算小计/总价。

当我增加第一项的数量时，我在小计中得到 NaN。

var price = parseFloat($('#price').text());

  $('#subtract').on("click",function() {
    var $qty = $('#qty');
    var current = parseInt($qty.val());
    if ( current > 0 ) {
        $qty.val(current-1);
        $('#subtotal').val(price*(current-1));
    } else {
        $('#subtotal').val(0);
    }
  });

  $('#add').on("click",function() {
    var $qty = $('#qty');
    var current = parseInt($qty.val());
    $qty.val(current+1);
    $('#subtotal').val(price*(current+1));
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<tr class="cart">
                  <td class="pt-3">
                    <img class="img-fluid rounded-pill float-left col-md-3 "  src="{{asset('front/')}}/assets/img/1.png"  alt="">
                    <div class="title pb-2">Margarhitta</div>
                    <div class="description" >Lorem ipsum sajdhasdhashd sajdhasdhashd sajdhasdhashd</div>
                  
                  </td>

                  <td  class="text-center"> 

                  <span class="price" id="price"><strong>$13.99</strong></span>
                  
                  </td>
                  <td  class="text-center">
                    
                    <input class="sub text-right" style="width:20px;" type="button" name="subtract" id="subtract" value="-" ></input>
                    <input type="text" name="qty" id="qty" value="0" class="qty" disabled></input> 
                    <input class="add text-left" style="width: 20px;" type="button" name="add" id="add" value="+"></input>
                    
                  </td>
                  <td  class="text-center">
                  <input type="text" name="subtotal" id="subtotal" value="0" class="subtotal" disabled></input>
                    
                  </td>
                  <td>
                  <a href="javascript:void(0)" class="remove"  ><i class="icofont-trash"></i></a>
                  </td>
              
          </tbody>

        </table>
        <input type="text" class="float-right " style="color: white;" name="total" id="total" value="0" class="total" disabled></input>

标签： jqueryshopping-cart

Answer 1

那是因为你的解析不成功。

你的代码需要这个：

parseFloat($('#price').text().replace("$",""));