javascript - 使用基于选择列表值和变量的JavaScript计算订单价格？

我想从以下计算总订单价格：

由清单清单值确定的特定项目的数量*该项目的设置成本

一共有3个项目，这是我现在的计算结果，但是不起作用（单击按钮时什么也没有发生）：

function calculate();
{

        var mugPrice = 5;
        var keyringPrice = 2;
        var tshirtPrice = 15;

        var numMug = document.getElementById('numberOfMugs').value
        var numTshirt = document.getElementById('numberOfTshirts').value
        var numKeyring = document.getElementById('numberOfKeyrings').value

        var totalpay = (numMug * mugPrice) + (numTshirt * tshirtPrice) + (numKeyring * keyringPrice);

        document.getElementById('totalPrice').value= totalpay;
}

这是我的按钮和字段的样子：

<button class="calcButton" onclick="calculate()">Calculate Order</button>
<h3>Total price: <input type=text; id="totalPrice" disabled /> </h3>

numMug，numTshirt和numKeyring是选择列表的ID，其值与某人希望购买的商品数量相对应

不知道我在做什么错？

谢谢

最佳答案

您需要删除分号：

function calculate();
                    ^

'use strict';
function calculate() {
    var mugPrice = 5,
        keyringPrice = 2,
        tshirtPrice = 15,
        numMug = +document.getElementById('numberOfMugs').value || 0,
        numTshirt = +document.getElementById('numberOfTshirts').value || 0,
        numKeyring = +document.getElementById('numberOfKeyrings').value || 0,
        totalpay = (numMug * mugPrice) + (numTshirt * tshirtPrice) + (numKeyring * keyringPrice);

    document.getElementById('totalPrice').value = totalpay;
}

Mugs: <input type="input" id="numberOfMugs"><br>
T-Shirts: <input type="input" id="numberOfTshirts"><br>
Keyrings: <input type="input" id="numberOfKeyrings"><br>

<button type="button" class="calcButton" onclick="calculate()">Calculate Order</button>
<h3>Total price: <input type="text" id="totalPrice" disabled /></h3>