原生JS将HH:MM时长与m/d/yy h:MM tt格式日期相加输出同格式结果

原有代码问题点 #

• 未正确获取DTin1、TotHr两个字段的实际值，直接传入字符串常量会导致后续逻辑完全错误，且Date.getTime()方法不接收任何参数，原有获取时间戳的写法无效
• TotHr是HH:MM格式的时长，仅包含小时、分钟两个部分，原有代码拆分后读取第三段（秒）会得到NaN，导致时长毫秒计算错误
• 最后没有将计算得到的新Date对象格式化为要求的m/d/yy h:MM tt格式，直接输出Date对象不符合需求

修复后完整代码 #

// 1. 获取两个字段的实际值，此处为表单输入框取值示例，可根据你实际的字段来源替换取值逻辑
const DTin1Str = document.getElementById('DTin1').value;
const TotHrStr = document.getElementById('TotHr').value;

// 2. 将DTin1字符串转换为标准Date对象
const [datePart, timePart, ampm] = DTin1Str.split(' ');
const [month, day, year] = datePart.split('/').map(Number);
const [hour, minute] = timePart.split(':').map(Number);
// 12小时制转24小时制处理
const formattedHour = ampm.toLowerCase() === 'pm' && hour !== 12 ? hour + 12 : ampm.toLowerCase() === 'am' && hour === 12 ? 0 : hour;
// 两位年份默认补20前缀，涉及19xx年场景可自行调整前缀
const originDate = new Date(2000 + year, month - 1, day, formattedHour, minute);

// 3. 计算TotHr对应的毫秒时长
const [thHour, thMinute] = TotHrStr.split(':').map(Number);
const timePeriodMil = thHour * 60 * 60 * 1000 + thMinute * 60 * 1000;

// 4. 计算相加后的新时间
const newDate = new Date(originDate.getTime() + timePeriodMil);

// 5. 将新时间转换为要求的输出格式
const newYear = newDate.getFullYear().toString().slice(-2);
const newMonth = newDate.getMonth() + 1;
const newDay = newDate.getDate();
let newHour = newDate.getHours();
const newAmpm = newHour >= 12 ? 'PM' : 'AM';
newHour = newHour % 12;
newHour = newHour === 0 ? 12 : newHour;
const newMinute = newDate.getMinutes().toString().padStart(2, '0');

const result = `${newMonth}/${newDay}/${newYear} ${newHour}:${newMinute} ${newAmpm}`;
console.log(result);
// 赋值到目标字段示例：document.getElementById('目标字段ID').value = result

补充说明 #

原生Date对象已经自动处理跨天、跨月、跨年的计算逻辑，无需额外开发适配。如果你的字段来源不是表单输入，仅需替换第一步的两个字段取值语句即可正常运行。

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