Question

我的应用程序中有一个有点杂乱的jquery，可以在结帐前为隐藏表单的税，运费和总字段分配值。我主要工作，但出于某种原因，如果你点击＆＃34;是的，我住在科罗拉多州＆＃34; （即将分配9美元的州税），即使税收确实显示，总数也不能正确累加（税不加入）。

我添加了一个可以复制问题的css-lite代码段。只需点击＆＃34;是的我住在CO＆＃34;，然后＆＃34;参见送货选项＆＃34;和＆＃34;计算总数＆＃34;。

＆＃13;

$(document).ready(function(){
    var $subtotal = $("#hfSubtotal").val();
    $(".footer").removeClass("top-shadow-inset");
    $(".choiceYesCO").click(function(){
      $(".choice-box").removeClass("active");
      $(".icon-choice").removeClass("ion-ios-checkmark-outline ion-ios-circle-outline")
      $(".choice-no-co").addClass("ion-ios-circle-outline")
      $(".choice-yes-co").addClass("ion-ios-checkmark-outline")
      $(this).addClass("active");
      var $tax = parseFloat($subtotal * .0463).toFixed(2);
      $("#hfTax").val($tax);
      $(".fieldTax").html("Tax: $" + $tax);
    });
    $(".choiceNoCO").click(function(){
      $(".choice-box").removeClass("active");
      $(".icon-choice").removeClass("ion-ios-checkmark-outline ion-ios-circle-outline")
      $(".choice-no-co").addClass("ion-ios-checkmark-outline")
      $(".choice-yes-co").addClass("ion-ios-circle-outline")
      $(this).addClass("active");
      var $tax = parseFloat(0.00).toFixed(2);
      $("#hfTax").val($tax);
      $(".fieldTax").html("Tax: $" + $tax);
    });
    $(".submitTax").click(function(){
      $(".stepTax").addClass("hidden");
      $(".stepShipping").removeClass("hidden");
      $(".fieldTax").removeClass("hidden");
    });
    var $tax = $("#hfTax").val();
    $(".submitShipping").click(function(){
      var $shipping = parseFloat(0.00).toFixed(2);
      $("#hfShipping").val($shipping);
      $(".fieldShipping").html("Shipping: $" + $shipping);
      var $total = parseFloat($subtotal).toFixed(2); + parseFloat($tax).toFixed(2); + parseFloat($shipping).toFixed(2);
      $("#hfTotal").val($total);
      $(".fieldTotal").html("<strong>Total: $" + $total + "</strong>");
      $(".stepShipping").addClass("hidden");
      $(".stepTotal").removeClass("hidden");
      $(".fieldShipping").removeClass("hidden");
      $(".fieldTotal").removeClass("hidden");
    });
    $(".submitTotal").click(function(){
      $(".edit_order").submit();
    });
  });

＆＃13;

.btn {
  display: block;
  background-color: red;
  padding: 5px;
  cursor: pointer;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="stepTax">
        <h3>Do you live in Colorado?</h3>
        <div class="choiceYesCO choice-box"><h4><i class="icon choice-yes-co icon-choice ion-ios-circle-outline"></i>Yes, I live in Colorado.</h4></div>
        <div class="choiceNoCO choice-box"><h4><i class="icon choice-no-co icon-choice ion-ios-circle-outline"></i>No, I don't live in Colorado.</h4></div>
        <div class="btn submitTax">See Shipping Options</div>
      </div>
      <div class="stepShipping hidden">
        <h3>Shipping Options Go Here</h3>
        <p>For now all shipping is free!</p>
        <div class="btn submitShipping">Calculate Total</div>
      </div>
      <div class="stepTotal hidden">
        <h3>You're ready to checkout!</h3>
        <div class="btn submitTotal">Checkout</div>
      </div>
      
      <form novalidate="novalidate" class="simple_form edit_order" id="edit_order_1" enctype="multipart/form-data" action="/orders/1" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="_method" value="patch" /><input type="hidden" name="authenticity_token" value="6P1CzQgCx7JVXAJgVi2puDOHX/fJApgUBeFI24TAh+ZWXZ5MmQfpMqGsxcnJl4Z6vwYp8A0MbOer34CJDnv4UQ==" />

        <h4>Subtotal: $200.00</h4>
        <input id="hfSubtotal" type="hidden" value="200.0" name="order[subtotal]" />

        <h4 class="hidden fieldTax"></h4>
        <input id="hfTax" type="hidden" value="9.26" name="order[tax]" />

        <h4 class="hidden fieldShipping">Shipping: $</h4>
        <input id="hfShipping" type="hidden" value="0.0" name="order[shipping]" />

        <h4 class="hidden fieldTotal"><strong>Total: $</strong></h4>
        <input id="hfTotal" type="hidden" value="200.0" name="order[total]" />

</form>

＆＃13;

有谁能看到我在这里出错的地方？

Answer 1

你在这里遇到的问题是你试图用“;”来计算总和在每个值之后，在第一个值上，它只是制动线并且总是给你200.00

var $total = parseFloat($subtotal).toFixed(2); + parseFloat($tax).toFixed(2); + parseFloat($shipping).toFixed(2);

删除那些“;”然后让最后一个，像这样改变它

var $total = (parseFloat($subtotal) + parseFloat($tax) + parseFloat($shipping)).toFixed(2);

这将解决问题。

Jquery不更新值/变量

1 个答案: