HTML中的自定义输入掩码

Question

我想使用自定义掩码生成输入类型的文本，例如--day/--night，用户只需用数字替换-。有什么建议吗？请帮帮我。

duration: --day/--night

Answer 1

使用两个输入效率更高。

但如果你真的想这样做，是的，你可以做到。每次用户输入字符时都需要检查输入值，并将值格式化为您想要的值。您还可以使用selectionStart和selectionEnd属性操作光标位置。

还有许多用于输入的掩码插件。 http://plugins.jquery.com/tag/mask/

Answer 2

您可以执行以下操作：

制作占位符＆＃34; - ＆＃34;用户可以在哪里写东西。这是一个简短的例子，我的意思是：

duration: <input placeholder="--" maxlength="2">day/<input placeholder="--" maxlength="2">night

Answer 3

Telerik提供他们的＆＃34; Kendo UI＆＃34;的免费版本。 JavaScript代码。以下是您想要的示例：http://demos.telerik.com/kendo-ui/maskedtextbox/index

这是免费代码：http://www.telerik.com/download/kendo-ui-core

这是他们在Github上托管的蒙面输入代码：https://github.com/telerik/kendo-ui-core/blob/master/src/kendo.maskedtextbox.js

Answer 4

编写这种类型的代码非常困难，但是您可以将这种代码用于这种格式。

<div>
    <label for="phone">Phone</label>
    <!-- or set via JS -->
    <input id="phone" type="text" />
  </div>

jquery代码

   $(":input").inputmask();

    $("#phone").inputmask({"mask": "99/99"});

查看代码笔链接 click here