jQuery 自动填充字段 - 基于数学

Question

我刚刚开始使用 jQuery 和 JS。我正在尝试根据其他字段动态设置首付字段和原则字段，但可以手动设置首付和原则字段。他们只需要加起来估计值/评估字段。还有一种奇怪的行为，如果我在带有自动填充字段的字段中输入一个值，它会保留它的原始值。有什么想法吗？

http://jsfiddle.net/wccznmr3/

//autocalculate downpayment
function computeD (){
    var value = $("#edit-field-estimated-value-und-0-value").val();
    var appraised = $("#edit-field-appraisal-amount-und-0-value").val();
    var mort1 = $("#edit-field-1st-mortgage-und-0-value").val();
    var princ = $("#edit-field-amount-new-und-0-value").val();
    var down = $("#edit-field-down-payment-und-0-value").val();

    function realVal () {
        var propValue;
        if (appraised === ""){
            propValue = value;
        } else {
            propValue = appraised;
        }
        return propValue;
    }

    var princP = realVal() - mort1 - down;
    var downP = realVal() - mort1 - princ;

    $("#edit-field-down-payment-und-0-value").val(downP);
    $("#edit-field-amount-new-und-0-value").val(princP);
}

//autocalculate down payment based on mort1 and princ
$("#edit-field-estimated-value-und-0-value,#edit-field-appraisal-amount-und-0-value, #edit-field-1st-mortgage-und-0-value,#edit-field-amount-new-und-0-value,#edit-field-down-payment-und-0-value").change(computeD);

Answer 1

每次更改本金和预付款输入字段时，都会调用确定本金和预付款输入字段值的函数并覆盖它们的值：

var princP = realVal() - mort1 - down;
var downP = realVal() - mort1 - princ;

$("#edit-field-down-payment-und-0-value").val(downP);
$("#edit-field-amount-new-und-0-value").val(princP);

因此，当用户手动更改这些字段时，computeD() 会被调用，并且它们的更改会被覆盖。如果您不希望重新计算这些值，请不要在这些字段的值发生更改时调用 computeD()：

//autocalculate down payment based on mort1 and princ
$("#edit-field-1st-mortgage-und-0-value, #edit-field-appraisal-amount-und-0-value, #edit-field-estimated-value-und-0-value").change(computeD);

此外，您可以使用disabled 属性来确保他们无法手动更改字段的值（如果这是您想要的）：

<input class="text-full form-text required" type="text" id="edit-field-amount-new-und-0-value" name="field_amount_new[und][0][value]" value="" size="10" maxlength="255" disabled>