javascript - パーセンテージ後の Javascript onChange 合計入力

Question

<form name="cost">
    <table border="1">
        <tr>
            <td>Cost</td>
            <td><input type="text" name="cost" /></td>
        </tr>
        <tr>
            <td>Discount</td>
            <td><input type="text" name="discount" /> (<span id="discount2"></span>)%</td>
        </tr>
        <tr>
            <td>Net Cost</td>
            <td><input type="text" name="net" /></td>
        </tr>
    </table>
</form>

皆さん、こんにちは。javascript プログラミングの助けが必要です。フォームのプロセスは次のとおりです。

1. コストに数を入れる
2. 次に、割引の数を入れます（自動計算スパン＃割引2 =コスト*割引/ 100）
3. 正味費用の自動更新 = 費用 - 割引

私は何度も試しましたが、運がなく、javascript の知識が不足しています。助けてください。

Answer 1

まず、それを行う関数を作成します

function calculateDiscount()
{
var cost = document.getElementById('cost').value;
var discount = document.getElementById('discount').value;
//do the math
var net = cost-discount;
//update
document.getElementById('discount2').innerHTML = cost*(discount/100);
document.getElementById('net').value = net;
}

また、すべての要素に ID を追加し、関数を呼び出すために、HTML を更新する必要があります。

<form name="cost">
<table border="1">
<tr><td>Cost</td><td><input type="text" id="cost" name="cost" onChange="calculateDiscount(); return false;" /></td></tr>
<tr><td>Discount</td><td><input onChange="calculateDiscount(); return false;" type="text" id="discount" name="discount" /> (<span id="discount2"></span>)%</td></tr>
<tr><td>Net Cost</td><td><input type="text" name="net" id="net" /></td></tr>
</table>
</form>