如何在输出HTML元素中扩展matematic公式

时间:2014-07-09 08:19:02

标签: html5

我有三个字段,其中一个是赚取金额,第二个是减税和第三个

一个是应付金额。现在它向我显示从

中扣除的税额

赚取金额,但我想在

中查看税收从中扣除的总数

应付金额框。

示例:如果我们的赚钱是1600,那么税是32,但我想要价值1568 进入我的应付金额字段?

以下是代码:

<form onsubmit="return false" oninput="amount.value = (earnamount.valueAsNumber) * ((taxdeduction.valueAsNumber))"
 oninput="amount.value">
  <legend>Test Environment.... Tax Deduction</legend>

  <p><label for="earnamount">&nbsp;&nbsp;Earn Amount</label>
  <input type="number" id="earnamount" name="earnamount"></p>

  <p><label for="taxdeduction">&nbsp;Tax Deduction</label>
  <input type="number" id="taxdeduction" value="0.02" name="taxdeduction"></p>

  <p><label for="amountpayable">Amount Payable</label>
  <input type="number" id="amountpayable" name="amountpayable"></p>

  <p>Total Tax In: <strong>USD: <output name="amount" for="earnamount taxdeduction">0</output></strong></p>
</form>

1 个答案:

答案 0 :(得分:0)

您可以使用 Jquery 轻松完成此操作。

$(function() {
  return $('#earnamount, #taxdeduction').change(function() {
    var earn_amount, tax_rate, tax_total, total;
    earn_amount = parseFloat($('#earnamount').val());
    tax_rate = parseFloat($('#taxdeduction').val());
    tax_total = earn_amount * tax_rate;
    total = earn_amount - tax_total;
    $('#amountpayable').val(total);
    return $('output[name="amount"]').text(tax_total);
  });
});

查看此fiddle