價格計算器使用表格

所以這裏的東西，我想通過讓用戶填寫表格，但它不會工作，使價格計算器。另外，我想在輸入字段中顯示結果。先謝謝你。價格計算器使用表格

<!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>

來源

2016-03-10 Richelle

'getElementByID'，它的'getElementById' – Ramanlfc

和'變種數量=的document.getElementById（「數量」）值;'代替'VAR數量=的document.getElementById（「qty」）;' –

仍然是相同的。結果不是來 – Richelle

錯誤

通過的getElementById請更改的getElementById。
parseInt只能解析整數值，所以你的乘法只給出整數值，所以你必須在float中解析。它給你完美的輸出。

<!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>

來源

2016-03-10 12:36:47

注意'parseFloat'，它可以給出意想不到的結果。嘗試'數字（項目）'而不是！ –

試着在你的小提琴中選擇「迪拜馬球」並將「1.1」放入文本框中。它應該給出3.3的結果，但它給出了'3.30000000000003'，這是因爲浮動的逗號。 –

@MarcosPérezGude感謝您的建議。我用另一種安全的方式更新了我的答案。 –

價格計算器使用表格

回答

相關問題