Question

所以这就是问题，我想通过让用户填写表单来制作价格计算器，但它不起作用。另外，我想在输入字段上显示结果。提前谢谢。

<!doctype HTML>
<html lang="en">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<title>

</title>
<head>

</head>
<body>
    <form role="form" id="price" name="price">    
        <select class="" id="itemselect" onchange="calculate()">
            <option id="itemprice" value="1.500">Adult's T-Shirt</option>
            <option id="itemprice" value="1.250">Kid's T-Shirt</option>
            <option id="itemprice" value="3.000">Dubai Polo</option>
            <option id="itemprice" value="6.000">Aerocool Polo</option>
            <option id="itemprice" value="4.000">Aerocool Crewneck</option>
            <option id="itemprice" value="5.000">Hoodies</option>
        </select>
        <p><input type="text" id="qty" onchange="calculate()" value=""></p>
        <p><input type="text" id="result" value="" disabled></p>        
    </form>
    
    <script type="text/javascript">
        function calculate(price){
            var item = document.getElementByID("itemselect").value;
            var qty = document.getElementByID("qty");
            
            item = parseInt(item);
            qty = parseInt(qty);
            
            var result = item*qty;
            
            document.getElementByID("result").value=result;
        }
    </script>
</body>
</html>

Answer 1

错误

请通过getElementById更改getElementByID。
parseInt只解析整数值，所以你的乘法只给你整数值，所以你必须在float中解析。它会给你完美的输出。

＆＃13;

<!doctype HTML>
<html lang="en">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<title>

</title>
<head>

</head>
<body>
    <form role="form" id="price" name="price">    
        <select class="" id="itemselect" onchange="calculate()">
            <option id="itemprice" value="1.500">Adult's T-Shirt</option>
            <option id="itemprice" value="1.250">Kid's T-Shirt</option>
            <option id="itemprice" value="3.000">Dubai Polo</option>
            <option id="itemprice" value="6.000">Aerocool Polo</option>
            <option id="itemprice" value="4.000">Aerocool Crewneck</option>
            <option id="itemprice" value="5.000">Hoodies</option>
        </select>
        <p><input type="text" id="qty" onchange="calculate()" value=""></p>
        <p><input type="text" id="result" value="" disabled></p>        
    </form>
    
    <script type="text/javascript">
        function calculate(price){
            var item = document.getElementById("itemselect").value || 0;

            var qty = document.getElementById("qty").value || 0;
            
            item = parseFloat(item).toFixed(2);
            qty = parseFloat(qty).toFixed(2);
            
            var result = parseFloat(item*qty).toFixed(2);
                            
            document.getElementById("result").value=result;
        }
    </script>
</body>
</html>

＆＃13;

价格计算器使用表格

1 个答案: