Question

我正在创建一个价格表，我根据固定价格和他们选择的票数计算两种票类型的小计价格。这两个功能正在按预期工作。之后我想通过将两个小计加在一起来计算总计。我做错了什么？

<div class="row">
  <div class="ticket-cat">
    <div class="col-xs-2">
      <p id="price-adult" data-price="12.77">€ 12.77</p>
    </div>
    <div class="col-xs-2">
      <select class="tickets-selection form-control" value="0" name="ticket-select-adult" id="ticket-select-adult">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
    </div>
    <div class="col-xs-3">
      <p id="adult-total" class="text-right">
        <span class="valuta hidden">€</span>
        <span class="total"></span>
      </p>
    </div>
  </div>
</div>
<div class="row">
  <div class="ticket-cat">
    <div class="col-xs-2">
      <p id="price-student" data-price="9.41">€ 9.41</p>
    </div>
    <div class="col-xs-2">
      <select class="tickets-selection form-control" value="0" name="ticket-select-student" id="ticket-select-student">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
    </div>
    <div class="col-xs-3">
      <p id="student-total" class="text-right">
        <span class="valuta hidden">€</span>
        <span class="total hidden"></span>
      </p>
    </div>
  </div>
</div>

的jQuery

$(function () {
    var $adultTotal = $("#adult-total .total");
    var adultPrice = parseFloat($("#price-adult").data("price"));

    // Fixes NaN and calculates the total price for adult tickets
    $('#ticket-select-adult').change(function () {
        var adultTicketsCount = parseInt(this.value, 10);
        var adultPriceTotal = isNaN(adultTicketsCount) ?
            ' n/a ' :
            (adultTicketsCount * adultPrice).toFixed(2);
        $adultTotal.text(adultPriceTotal);
    });

    var $studentTotal = $("#student-total .total");
    var studentPrice = parseFloat($("#price-student").data("price"));

    // Fixes NaN and calculates the total price for student tickets
    $('#ticket-select-student').change(function () {
        var studentTicketsCount = parseInt(this.value, 10);
        var studentPriceTotal = isNaN(studentTicketsCount) ?
            ' n/a ' :
            (studentTicketsCount * studentPrice).toFixed(2);
        $studentTotal.text(studentPriceTotal);
    });

    // Add together the variables 
    totalPriceTickets = 0;
    totalPriceTickets = parseInt(adultPriceTotal) + parseInt(studentPriceTotal);
    console.log(totalPriceTickets, "Hello, world!");

});

https://jsfiddle.net/mckeene/rLnv348x/

Answer 1

有些问题是由于变量超出范围，所以我在顶部定义了它们。每次更改值时，都应显示总计console.log()。这是你的另一个问题，最初显示的是总数而不是每次更改数值时。

$(function () {
    var $adultTotal = $("#adult-total .total");
    var adultPrice = parseFloat($("#price-adult").data("price"));
    var $studentTotal = $("#student-total .total");
    var studentPrice = parseFloat($("#price-student").data("price"));
    var adultPriceTotal = 0;
    var studentPriceTotal = 0;
    var totalPriceTickets = null;

    // Fixes NaN and calculates the total price for adult tickets
    $('#ticket-select-adult').change(function () {
        var adultTicketsCount = parseInt(this.value, 10);
        adultPriceTotal = isNaN(adultTicketsCount) ?
            0 :
            (adultTicketsCount * adultPrice).toFixed(2);
        $adultTotal.text(adultPriceTotal);

        totalPriceTickets = calculateTotal(adultPriceTotal, studentPriceTotal);
    });

    // Fixes NaN and calculates the total price for student tickets
    $('#ticket-select-student').change(function () {
        var studentTicketsCount = parseInt(this.value, 10);
        studentPriceTotal = isNaN(studentTicketsCount) ?
            0 :
            (studentTicketsCount * studentPrice).toFixed(2);
        $studentTotal.text(studentPriceTotal);

        totalPriceTickets = calculateTotal(adultPriceTotal, studentPriceTotal);
    });

    function calculateTotal(adultPriceTotal, studentPriceTotal) {
        var total = parseInt(adultPriceTotal) + parseInt(studentPriceTotal);

        console.log(total)
        return total;
    }
});

将计算变量加在一起

1 个答案: