Javascript 计算价格

我正在试图计算网站上“订购产品”的最终价格，我只是想知道哪里出了问题，因为其中一个显示了带有“€NaN[HTML元素]”的警报

但是现在它说在$（“.smallPrice”上有一个错误 我想知道是否有一种方法可以从选择输入类型继承

编辑-现在正在打印“€

函数乘法（）{
var smallPrice=149.99；
var-mediumPrice=249.99；
var largePrice=399.99；
var数量=document.getElementById（$（“#数量”）.value）；
var标准值=20.00；
var expresDeliver=33.00；
var nextDeliver=50.00；
if（$（“#smallPrice”）.val（）=smallPrice）{
var总计=数量*价格；
}else if（$（“#mediumPrice”）.val（）==mediumPrice）{
var总计=数量*中等价格；
}否则{
var总计=数量*大价格；
}
var deli=document.getElementById（$（“#交付”）.value）；
var合计=数量*定价+熟食；
console.log（总计，大小）
警惕（“价格为€”+总计）；
}

量
颜色
大小
传送
全部的
玫瑰金
空间
3.0毫米
4.5毫米
6.0毫米
欧盟标准交货
三天快递
次日交货
您的JS代码中只有几个错误，并且一些HTML标记未关闭：

        <!-- HTML -->
<table id="pricing">
    <tr>
        <th>Quantity</th>
        <th>Color</th>
        <th>Size</th>
        <th>Delivery</th>
        <th>Total</th>
    </tr>

    <tr>
        <td>
            <input type="number" name="Quantity" min="1" max="2" 
        id="quantity">
        </td>
        <td>
            <select name="coloured">
              <option value="rose">Rose Gold</option>
              <option value="space">Space</option>
            </select>
        </td>
        <td>
            <select name="size" id="size">
              <option value="small">3.0mm</option>
              <option value="medium">4.5mm</option>
              <option value="large">6.0mm</option>
            </select>
        </td>
        <td>
            <select name="deliver" id="deliver">
            <option value="standard" id="stanDeliver">Standard EU Delivery</option>
            <option value="express" id="expresDeliver">Express 3 Day Delivery </option>
            <option value="nextday" id="nextDeliver">Next Day Delivery</option>
        </td>
        <td><input type="text" name="total" value="€" size="5"  id="total" readonly></td>
    </tr>
    <tr id="price" value=euro></tr>
    <input type = "submit" size = "20" name = "Send" id = "submit" value = "Send" onClick = "multiply()">
</table>

<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">

    function multiply(){

        var smallPrice  = 149.99;
        var mediumPrice = 249.99;
        var largePrice = 399.99;

        // Set delivery prices on an object to compare against the value selected for delivery
        var deliveryPrices = {
            'standard' : 10.00,
            'express' : 20.50,
            'nextday' : 40.00
        };

        // Gets the quantity value as a number
        var quantity = Number($("#quantity").val());

        // Compare the prices, i do not understand your logic here
        if ( $('#smallPrice').val() == smallPrice){
            var total = quantity * smallPrice;
        } else if ($("#mediumPrice").val() == mediumPrice){
            var total = quantity * mediumPrice;
        } else {
            var total = quantity * largePrice;
        }

        // Get the delivery value
        var deli = $("#deliver").val();

        // Adds the delivery cost (set previously) to the total
        var total = total + deliveryPrices[deli];

       alert("The price is €"+total);

    }

</script>


量
颜色
大小
传送
全部的
玫瑰金
空间
3.0毫米
4.5毫米
6.0毫米
欧盟标准交货
三天快递
次日交货
函数乘法（）{
var smallPrice=149.99；
var-mediumPrice=249.99；
var largePrice=399.99；
//设置对象的交货价格，以与为交货选择的值进行比较
var交货价格={
“标准”：10.00，
“快车”：20.50，
“下一天”：40.00
};
//以数字形式获取数量值
变量数量=数量（$（“#数量”）.val（）；
//比较一下价格，我不明白你的逻辑
if（$（'#smallPrice'）.val（）==smallPrice）{
var总计=数量*价格；
}else if（$（“#mediumPrice”）.val（）==mediumPrice）{
var总计=数量*中等价格；
}否则{
var总计=数量*大价格；
}
//获取交付价值
var deli=$（“#交付”）.val（）；
//将交付成本（以前设置）添加到总成本中
var总计=总计+交货价格[deli]；
警惕（“价格为€”+总计）；
}
您的问题是将jQuery对象视为值

$
函数接受选择器作为参数并返回任何匹配的元素。例如，
$（'.smallPrice'）
使用样式类
smallPrice
搜索所有元素。如果要搜索id为
smallPrice
的元素，可以在id前面加一个哈希：
$（“#smallPrice”）

这段代码实际上不需要jQuery，因为您可以使用本机javascript按id获取元素：

var prices = {
  small: 149.99,
  medium: 249.99,
  large: 399.99,
  standard: 20.00,
  express: 33.00,
  nextday: 50.00
};

function multiply(){
  var quantity = document.getElementById("quantity").value;
  var size = document.getElementById("size").value;
  var deli = document.getElementById("deliver").value;

  if(!quantity){
    return alert("Please enter a quantity");
  }

  var total = (quantity * prices[size]) + prices[deli];

  console.log(total)
  alert("The price is €"+total);
}

这里有一个例子：
我想这是因为美元（“.smallPrice”）返回一个jQuery html元素，而不是您要查找的select的值。@Bosen这是否意味着如果我导入jQuery，它可能会工作？我没有看到
.smallPrice
和
mediumPrice
元素同样，如果您要获取smallPrice的id，我想您应该使用“#smallPrice”而不是.smallPrice“由于后者指的是类，因此您共享的代码存在多个问题。
select
标记未关闭。行
var deli=document.getElementById（“deliver”）
应为
$（“#deliver”）.value
。我假设您希望选择下拉列表中选择的值。然后您将价格添加到所选的值中，但由于这是一个字符串，您将得到一个串联字符串，或者非常感谢您指出了缺陷，我只是看了它很长时间，它看起来并不不合适。@Kylemcann No p问题-有时候你需要的只是一双眼睛！@Michael Kucinski非常好，至少现在已经解决了：）