JavaScript日期添加天数功能异常问题求助

问题场景 #

管理员通过PHP定义define('INVOICE_PAYMENT_TERM', '15');设置发票付款期限天数，该值通过隐藏输入框pay_term传递到前端。当用户选择发票日期后，JavaScript需自动计算到期日，但出现异常：

• 选择发票日期为2023年3月1日，预期到期日为2023年3月16日
• 实际得到2023年6月23日
• 直接将代码中的变量nod替换为固定值15时，计算结果正常

相关代码 #

表单代码

<div class="col-xl-4">
<p class="card-text">Invoice Date: *
<input id="pay_term" type="hidden" name="pay_term" value="<? echo str_replace("'","",INVOICE_PAYMENT_TERM)?>"></p>
<input id="invoice_date" type="date" name="invoice_date" onchange="getdate()" required></p>
</div>

JavaScript代码

<script>
    $(document).ready(function () {
        $('#invoice_date').datepicker();
    });
    function getdate() {
        var tt = document.getElementById('invoice_date').value;
        var nod = document.getElementById('pay_term').value;

        var date = new Date(tt);
        var newdate = new Date(date);

        newdate.setDate(newdate.getDate() + nod);

        var dd = ('0' + newdate.getDate()).slice(-2);
        var mm = ('0' + (newdate.getMonth()+1)).slice(-2);
        var y = newdate.getFullYear();

        var someFormattedDate = dd + '/' + mm + '/' + y;
        document.getElementById('invoice_due_date').value = someFormattedDate;
    }
</script>

问题原因 #

核心问题是字符串与数字的错误拼接：

• 隐藏输入框pay_term的值是字符串类型（即使内容是数字"15"）
• newdate.getDate()返回的是数字类型（比如1）
• 两者相加时，JavaScript会执行字符串拼接而非数字加法，即1 + '15' = '115'
• setDate(115)会将初始日期往后推115天，3月1日加115天正好是6月23日，与异常现象完全匹配

修复方案 #

方案1：将nod转换为数字类型（推荐） #

获取pay_term的值时，用parseInt()或Number()显式转为数字：

// 方法A：使用parseInt，指定进制为10
var nod = parseInt(document.getElementById('pay_term').value, 10);

// 方法B：使用Number()转换
var nod = Number(document.getElementById('pay_term').value);

// 方法C：一元加号快速转换
var nod = +document.getElementById('pay_term').value;

修改后，newdate.getDate() + nod会执行数字加法，1+15=16，计算出正确的到期日3月16日。

方案2：PHP输出时确保数字类型（辅助优化） #

可以在PHP输出时将值转为整数，进一步避免字符串类型的潜在问题：

<input id="pay_term" type="hidden" name="pay_term" value="<? echo (int)INVOICE_PAYMENT_TERM; ?>">

注意：即使PHP输出数字，输入框的值仍会是字符串，前端仍需做类型转换。

验证效果 #

修改后选择2023年3月1日，nod被转为数字15，newdate.getDate()返回1，相加得到16，最终到期日为2023年3月16日，符合预期。

内容的提问来源于stack exchange，提问作者Simon Hammond