javascript - 折扣价格的计算在jquery中没有显示为数字？

Question

我正在尝试制作一个表格，根据所选的日期和时间更新门票价格，在某些日子里会打折，而在其他日子里则不会。

就门票定价而言，我一直在使用 HTML 来存储和操作值，如下所示:

<tr>
    <td>Adult</td>
        <td>
            <select class="qty" name="SA">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
            </select>
        </td>
        <td>
           <input type="text" value="18.00" class="price" readonly>
        </td>
        <td align="center">
            <span class="amount">$0.00</span>
        </td>
    </tr>

工作原理

• 数量 value根据用户选择的下拉选项进行选择。

• 然后将数量值乘以价格，并将其存储在 value 中。在 <input> HTML，在本例中为 18。

• <span>然后用结果更新，显示小计价格。

• 注意:我还有 <tr> 的多个部分与此相同

计算使用JS/jquery

    //price of seating
function calculatePrice() {

    var time = $("#whichSession").val(); // sets time to value
    var day = $("#whichDay").val(); // sets day to value

    var sum = 0;

    $('#bookingTable > tbody  > tr').each(function () {
        var qty = $(this).find('option:selected').val();
        var price = $(this).find('.price').val();
        var amount = (qty * price)
        sum += amount;
        $(this).find('.amount').text('$' + amount.toFixed(2));
    });
    //just update the total to sum  
    $('#totalprice').val(sum.toFixed(2));
}

另一位用户建议我创建一个新函数来更新 value实时了解价格，以便获得合适的折扣值。

用于计算折扣价格的JS/jquery

// calls get price function on day change
$('.qty').change(function () {
    getPrices();
});

// sets value of price based on day and time
function getPrices ( day, time ) {  
  if ( day=='mon' || day == 'tue' || time=='1pm' ) {
    prices = {SA:12, SP:10, SC:8, FA:25, FC:20, B1:20, B2:20, B3:20}
  } else {
    prices = {SA:18, SP:15, SC:12, FA:30, FC:25, B1:30, B2:30, B3:30}
  }
  return prices;
}   

我的问题

当我使用alert时为了显示它实际上将其更改为什么值，它似乎是正确的。但是，它在 span 中打印为“$NaN”这意味着显示每张票的小计金额。

JSFiddle

我创建了一个 fiddle ，这样你们就可以看到整个事情是如何运作的。如果任何代码有问题，请原谅。当它实际出现在我的网站上时，效果会更好。

很抱歉这篇文章很长。我只是想确保我对自己的问题非常清楚。如果有任何不清楚的地方，请告诉我，我会尽力澄清。

提前致谢!

Answer 1

问题在于您的函数 getPrices() 返回的是 JavaScript 对象而不是数字。

所以如果你这样做:

var amount = (qty * prices.SP);

而不是:

var amount = (qty * price);

您的金额是一个数字，您可以对其进行数学运算