jQuery实时百分比计算问题：数值拼接而非相加

首先，你的核心问题是输入框获取的内容默认是字符串类型，直接用+运算符时会触发字符串拼接，而非数学加法运算。比如输入100，计算2%得到2，"100" + "2"就会变成"1002"，而不是你期望的102。

修正后的代码方案 #

我帮你简化并调整了代码，完全贴合你实际需求的逻辑（基于totalsecurity字段计算）：

$(function () {
    // 绑定totalsecurity输入框的keyup事件
    $('input:text[id$=totalsecurity]').keyup(calculateTotalLoan);

    function calculateTotalLoan() {
        // 获取输入值并转为浮点数，用|| 0处理空值/非数字输入，避免NaN
        var totalSecurity = parseFloat($(this).val()) || 0;
        // 计算2%的金额
        var percentAmount = totalSecurity * 0.02;
        // 计算总和：本金 + 2%比例金额
        var totalLoan = totalSecurity + percentAmount;
        // 将结果赋值给totalloan，用toFixed(2)保留两位小数（按需调整）
        $('input:text[id$=totalloan]').val(totalLoan.toFixed(2));
    }
});

关键改动说明 #

• 类型转换：用parseFloat()把输入框的字符串值转为数值类型，|| 0是为了处理空输入或非数字内容，避免出现NaN异常。
• 逻辑简化：去掉了冗余的add2和IsNumeric2函数——当前需求只需要单一输入的计算，没必要保留多参数求和的复杂逻辑。
• 格式优化：toFixed(2)确保结果以两位小数展示，符合金额类数据的常规显示要求，如果不需要可以直接移除。

测试验证 #

输入100到totalsecurity框中，totalloan会显示102.00；输入500则显示510.00，彻底解决字符串拼接的问题。

内容的提问来源于stack exchange，提问作者Love Crypto