如何自动格式化时钟选择器？

Question

我使用时钟选择器(https://github.com/weareoutman/clockpicker)，当输入字段时，我想自动格式化时间。

这是时钟选择器的代码：

$('.container').each(function(){
    var clockpicker = $(this).find('input').clockpicker({
    autoclose: true,
    twelvehour:true,
    afterDone: function() {
        clockpicker.val(clockpicker.val().slice(0,-2)+' '+clockpicker.val().slice(-2));
    }
});

这是演示的摇摆不定：http://jsfiddle.net/1e71occs/4/

例如，jquery时间选择器提供了格式化的选项。下面是示例的链接

预期输出

如果用户输入：

1234 => 12:34 AM
1234p => 12:34 PM

如何在时钟选择器中格式化输入时间？

谢谢

Answer 1

Jquery允许对每个元素应用多个插件。

您可以同时使用时钟选择器和时间选择器，如下所示

$('.container').each(function(){
     var clockpicker = $(this).find('input').clockpicker({
               autoclose: true,
               twelvehour:true,
               afterDone: function() {
                   clockpicker.val(clockpicker.val().slice(0,-2)+' '+clockpicker.val().slice(-2));
               }
     }).timepicker({dropdown:false,defaultTime:''});
});

Answer 2

ClockPicker最初是为Bootstrap而设计的。所以Bootstrap (和jQuery)是唯一的依赖项。

由于它只使用.popover和一些.btn样式的Bootstrap，所以我选择了这些样式来构建jQuery插件。可以随意使用jquery-*文件而不是引导-*，用于非引导项目。

https://weareoutman.github.io/clockpicker/