更新时显示的价格答案

【问题标题】：Update price shown onchange更新时显示的价格
【发布时间】：2017-10-17 05:36:17
【问题描述】：

我只是想显示一个价格，以更新 onchange 事件。现在，这只是向我显示 onchange id 的两个值，我想让某人单击一个复选框，然后它将已经显示的价格更新为新值。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 <html>
 <head>
 </head>
 <body>
 <table>
    <tr>
      <td>
      <input type="checkbox" id="extras" value="25.00" onChange="calc()">
      </td>
     <td>
      <input type="checkbox" id="rush" value="35.00" onChange="calc()">
      </td>
      <td>
           <input id="total" type="text" value="90.00" />
      </td>
 </tr>
 </table>
 </body>
 <script type='text/javascript'>
      function calc() {    
          var extras = document.getElementById('extras').value;
          var rush  = document.getElementById('rush').value;
          var result = document.getElementById("total");
          result.value = extras + rush;
      }
 </script>
 </html>

【问题讨论】：

这个问题有很多重复项。使用 jquery 并查看此链接：stackoverflow.com/questions/4813219/jquery-checkbox-value
不是真的 - 那是关于做警报。
stackoverflow.com/questions/21442833/…
让我进一步解释一下。我有一个已经显示价格的 php 脚本。 ($90.00) 然后有两个复选框，一个用于附加功能，一个用于加急。当有人检查一个时，它应该取 90 美元并从 extras/rush 或两者中添加价值。

标签： javascript jquery html

【解决方案1】：

你可以这样做：

$('input[type=checkbox]').change(function () {
    var val = parseFloat(this.value),
        totalVal = parseFloat($('#total').val());
    if (this.checked) {
        $('#total').val((totalVal + val).toFixed(2));
    } else {
        $('#total').val((totalVal - val).toFixed(2));
    }
});

Fiddle Demo

【讨论】：

【解决方案2】：

非 jquery 解决方案可能是检查 checked 值。您还需要将文本值转换为浮点值，否则它将不是有效的总和，而只是字符串的串联。

var extrasCB = document.getElementById('extras');
var extras = 0;
if(extrasCB.checked) {
    extras = parseFloat( extrasCB.value );
}

【讨论】：