使用jquery输入时间掩码

Question

我正在使用meioMask - 一个jQuery掩码插件,将时间掩码放在文本框中.这是JsFiddle.它运作良好.但我还需要放入hh:mm文本框,让用户知道在文本框中输入什么内容.

这该怎么做.

编辑:我还需要将am/pm放在掩码中.我需要12小时的时间格式.

Answer 1

如果你想要简单和干净,这是一个快速但完整的演示(参见:http://jsfiddle.net/bEJB2/),其中包括一个placeholder和一个共同使用的面具.它使用jQuery插件jquery.maskedinput.JavaScript非常干净清晰

<div class="time-container">
     <h1> Demo of Mask for 12 Hour AM/PM Input Field w/ Place Holder </h1>

    <input class="timepicker" type="text" size="10" placeholder="hh:mm PM" />
</div>
<script>
    $.mask.definitions['H'] = "[0-1]";
    $.mask.definitions['h'] = "[0-9]";
    $.mask.definitions['M'] = "[0-5]";
    $.mask.definitions['m'] = "[0-9]";
    $.mask.definitions['P'] = "[AaPp]";
    $.mask.definitions['p'] = "[Mm]";

    $(".timepicker").mask("Hh:Mm Pp");
</script>

我想重复一下@YiJiang说,大约PolyFills和Modernizr的对placeholder非HTML5浏览器处理为好.

Answer 2

看来你应该能够使用插件来设置它。

也许这是一个开始？

如果您查看代码，我认为您应该传递setMask一个options对象。看起来这defaultValue是一个可能的选择。

看起来以下内容应该有效（但事实并非如此）：

   $("#txtTime").setMask({mask: "time", defaultValue:"hh:mm"});

这就是我正在看的：

$.fn.extend({
        setMask : function(options){
            return $.mask.set(this, options);
        },

和

        // default settings for the plugin
        options : {
            attr: 'alt', // an attr to look for the mask name or the mask itself
            mask: null, // the mask to be used on the input
            type: 'fixed', // the mask of this mask
            maxLength: -1, // the maxLength of the mask
            defaultValue: '', // the default value for this input