html 输入上的多个小数点分隔符

Question

我正在寻找一个输入，它可以采用具有多个小数点分隔符的 MHz 频率。

即

14.010.56 MHz

目前我的输入是

<input type="number" step="any" class="form-control" id="freq" placeholder="Frequency MHz">

但这只允许使用一个小数点，就好像它是一个 'normal' 浮点数一样。这能做到吗？

Answer 1

你能接受字符串形式的输入，然后拆分字符串以创建一个包含三个值的数组吗？

或者，连续放置三个输入，用“.”分隔。就像电话号码经常做的那样

Answer 2

HTML5 向 input 元素引入了一个 pattern 属性，它采用在提交时验证的正则表达式。

您需要的正则表达式可能只是 1+ 位，然后是一个点，然后是 1+ 位，然后是一个点，然后是 1+ 位：\d+\.\d+\.\d+:

<form>
    <input type="text" name="freq" placeholder="Frequency MHz" pattern="\d+\.\d+\.\d+" />
    <input type="submit" value="GO" />
</form>

Answer 3

使用这个正则表达式

^[0-9]*\.{1}[0-9]*\.{1}[0-9]*$

multiple decimal separators on html input