Question

HTML

<table>
        <tr>
            <td><b>Interest Rate</b></td>
            <td><b>Amount</b></td>
        </tr>
        <tr>
            <td>1%</td>
            <td>€0 - €1,000</td>
        </tr>
        <tr>
            <td>5%</td>
            <td>€1,001 - €5,000</td>
        </tr>
        <tr>
            <td>15%</td>
            <td>> €5,001</td>
        </tr>
    </table><br  />
    <label>Please enter an amount to deposit</label>
    <input type="number" id="amount" name="txtAmount" />
    <hr />

    <table>
    <tr>
        <td><b>Item</b></td>
        <td><b>Amount</b></td>
    </tr>
    <tr>
        <td>Sub-Total (Interest + Amount)</td>
        <td><input type="number" id="txtSubTotal" name="txtSubTotal" readonly /></td>
    </tr>
    <tr>
        <td>Interest Amount</td>
        <td><input type="number" id="txtInterest" name="txtInterest" readonly /></td>
    </tr>
    <br  />
    <input type="button" name="btnCalc" id="btnCalc" onclick="Calc()" value="Calculate Amount"/>

JS

function Calc() {
            var amount = parseFloat(document.getElementById('txtAmount').value);      
            var int;
            var intTotal;

            if (amount < 1000) {
                int = (amount * 0.01);
                intTotal = (int + amount);
                document.getElementById('txtSubTotal').innerHTML = intTotal;
                document.getElementById('txtInterest').innerHTML = int;
            }
            else if (amount > 1001 && amount < 5000) {
                int = (amount * 0.05);
                intTotal = (int + amount);
                document.getElementById('txtSubTotal').innerHTML = intTotal;
                document.getElementById('txtInterest').innerHTML = int;
            }
            else {
                int = (amount * 0.15);
                intTotal = (int + amount);
                document.getElementById('txtSubTotal').innerHTML = intTotal;
                document.getElementById('txtInterest').innerHTML = int;
            }

        }

我需要根据用户输入计算利率。有三种利率，一旦计算出来，它就会显示利率和总数，但我似乎在我的代码中遗漏了一些内容，因为它不会显示任何内容。

Answer 1

您有一个小标记问题。 JS中引用的id与标记中的id不同。

从

更新标记

<input type="number" id="amount" name="txtAmount" />

到

<input type="number" id="txtAmount" name="txtAmount" />

此外，您需要更新脚本以将值设置为输入框。

从

更新

document.getElementById('txtSubTotal').innerHTML = intTotal;
document.getElementById('txtInterest').innerHTML = int;

到

document.getElementById('txtSubTotal').value = intTotal;
document.getElementById('txtInterest').value = int;

工作版本 - http://plnkr.co/edit/cHSdLBf3cvft4Q9gQBiu?p=preview

Javascript：基于三种利率的利息

1 个答案: