如何进行仅允许特定数字的屏蔽输入？答案

【问题标题】：How do I make a masked input that only allows specific numers?如何进行仅允许特定数字的屏蔽输入？
【发布时间】：2015-12-08 01:07:41
【问题描述】：

我想做一个只接受以下内容的屏蔽输入：

00-24:30 或 00

这是一天中的某个时间框。

例如： 12:30 或 12:00

我一直在使用这个组件： https://github.com/insin/inputmask-core#pattern

但是，如果您使用此模式，它将需要任何数字： 11:11

        <MaskedInput value={this.props.time}
                     pattern={"11:11"}
                     maskPlaceholder={TIME_FORMAT}
                     placeholder={TIME_FORMAT}
                     onChange={this._onTimeChange}>
                     <Input type="text" className={InputClasses} />
        </MaskedInput>

我能做什么？

【问题讨论】：

标签： javascript datetime reactjs maskedinput

【解决方案1】：

文档很清楚 '1' 接受任何数字。看来您必须为每个数字创建自己的验证器。

var mask = new InputMask({
  pattern: '21:51', // An uppercase letter followed by 5 word characters
  formatCharacters: {
    '2': {
      validate: function(char) { return /[012]/.test(char) }
    },
    '5': {
      validate: function(char) { return /[0-5]/.test(char) }
    }
  }
})

说实话，这很笨拙。它也接受 29:00，但我看不到使用该组件改进它的方法。

【讨论】：