使用 jQuery 进行实时会计更改答案

【问题标题】：Real time accounting changes with jQuery使用 jQuery 进行实时会计更改
【发布时间】：2013-04-04 06:09:01
【问题描述】：

我正在尝试创建一个标签，其中包含一个人输入收费金额时的余额变化。所以假设类似......

<table>
    <tr>
        <td class="remainingBudget"></td>
        .
        .
        .

……然后……

<form>
    <table>
        <tr>
            <td><input class="percentCommitment"></td>
            <td><input class="totalAmount"></td>
            .
            . 
            .

用户永远不会触摸totalAmount表单输入，只有percentCommitment，它会根据另一个值计算totalAmount，我们不需要担心。我在 percentCommitment 的 keydown 事件上自动填充了 totalAmount 输入，如下所示...

$(".percentCommitment").keyup(function() {
    var commit = caluculatePercentCommitment() || 0;
    var salary = getSalary();
    var amount;
    if (commit > 0 && salary > 0) {
        ttl = (salary * commit) / 100;
    } else {
        amount = 0.00;
    }

    $(this).parent().find('.amountCommitment').val(amount);
});

这部分工作正常，当人更改percentCommitment 值时，总金额会实时正确计算。这是有效的，因为我将承诺百分比乘以个人年薪的值是静态的。它没有改变。所以如果该人输入1，则计算并显示1%的薪水。如果用户再增加 2，12% 是从相同的原始工资中计算出来的，这正是我想要发生的。

问题在于实时计算剩余预算。从remainingBudget 中减去totalAmount 会产生问题，因为如果用户做同样的事情，输入1，那么我的jQuery 会做newRemainingBudget = remainingBudget - (0.01 * salary)，这很好，但是如果他们加上2 我正在做@987654331 @，这不是我想要的。我希望根据原始剩余预算计算所有更改。

我试图做这样的事情......

 $(".totalAmount").change(function (event) {
            var remain = $(".remainingBudget").text();
            remain = formatDecimalInput(remain);
            var enter = $(".totalAmount).val();
            enter = formatDecimalInput(enter);
            if (enter <= remain) {
                $(".remainingBudget")text((remain-enter).formatCurrency());
            }
            else {
                // Do nothing
                event.preventDefault();
            }
        });

【问题讨论】：

标签： javascript jquery html forms web-applications

【解决方案1】：

您必须在屏幕上留出一个位置来保存总预算金额，并使用它加上其他字段来计算剩余金额。替换时不要以这种方式使用字段。

remainingBudget = totalBudget - (0.01 * salary)

注意：如果需要，您可以使用隐藏的表单字段来保存总计。

【讨论】：

是的，我就是这么想的，隐藏领域...谢谢李。