如何通过编程选中type为time的input输入框的分钟部分？

原生 <input type="time"> 的默认focus行为是选中最左侧的小时段，你可以通过操作输入框的文本选中范围API实现选中分钟段。

你可以使用以下代码实现需求：

const timeInput = document.querySelector('#time');
timeInput.focus();
// 原生time输入框的value固定为HH:mm格式，分钟段的字符下标范围是3到5
timeInput.selectionStart = 3;
timeInput.selectionEnd = 5;

如果上述代码在部分浏览器中被默认focus逻辑覆盖不生效，可以添加0延迟的setTimeout让你的选中逻辑在浏览器默认行为执行完毕后再触发：

const timeInput = document.querySelector('#time');
timeInput.focus();
setTimeout(() => {
  timeInput.selectionStart = 3;
  timeInput.selectionEnd = 5;
}, 0);

补充说明 #

• 如果你的time输入框开启了秒数显示（设置了step属性小于60），value格式会变为HH:mm:ss，分钟段的下标范围仍然是3到5，需要选中秒段的话把范围调整为6到8即可。
• 部分老旧浏览器或移动端浏览器对原生time输入框的selection API兼容性有限，遇到持续不生效的情况可以考虑改用自定义时间选择组件。

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