12 小时时间格式的 JQuery 输入掩码

Posted 2023-05-08

【中文标题】12 小时时间格式的 JQuery 输入掩码

【英文标题】：JQuery input mask for 12 hour time format

【发布时间】：2016-04-11 07:08:33

【问题描述】：

我正在使用 jquery inputMask 库（https://github.com/RobinHerbots/jquery.inputmask）。但是如果有更好的 inputMask 库，请随时告诉我。但我需要 inputMask，而不是时间选择器。

场景是在时间字段上有 inputMask。我们希望根据用户的区域设置显示和输入掩码，因此它应该支持 12 小时和 24 小时格式。最初我们只支持 24 小时格式，所以掩码代码如下所示：

$('input[id$="endTime"]').inputmask("hh:mm:ss", placeholder: "HH:MM:SS", insertMode: false, showMaskOnHover: false);

请注意，我们也需要支持秒。对于 12 小时格式，我实际上尝试了几种格式，但没有一个对我很有效。那么可以屏蔽吗？

【参考方案1】：

$('input[id$="endTime"]').inputmask("hh:mm:ss", 
        placeholder: "HH:MM:SS", 
        insertMode: false, 
        showMaskOnHover: false,
        hourFormat: 12
      
   );

Demo

提示：打开文件 jquery.inputmask.bundle.js，搜索 datetime 并查看所有选项。

（对不起，我无法添加评论，因为我没有足够的限制点。）

【讨论】：

谢谢维克多。它工作得很好。但我的问题是，我怎样才能在它的末尾加上 am/pm？

编辑占位符属性：placeholder: "HH:MM:SS xm",

这不起作用...我试图只修改占位符，占位符和输入掩码字符串都不能正常工作。

我想通了，我只需要将掩码设置为“h:s:s t\\m”就可以了。

在 4.x 版本中发现它会是：$('#endTime').inputmask( alias: "datetime", placeholder: "12:00 AM", inputFormat: "hh:MM TT", insertMode: false, showMaskOnHover: false, hourFormat: 12

【参考方案2】：

输入“24”而不是 24

$('input[id$="endTime"]').inputmask("hh:mm:ss", 
    placeholder: "HH:MM:SS", 
    insertMode: false, 
    showMaskOnHover: false,
    hourFormat: "24"
  );

【讨论】：

不仅已经回答了，而且这个贡献是不正确的。该问题专门要求使用a.m./p.m. 的12 小时格式，而不是24 小时格式。