遮罩文字输入

Question

嘿，我正在尝试制作一个像这样的简单输入文本。

<input type="text" id="pin" name="pin" maxlength="4" size="4" placeholder="____">

现在，在前端，我希望保留该占位符，直到用户键入所有字符为止。

例如：

1___
12__
123_
1234

这清楚吗？ 谢谢您的帮助

编辑：让我说得更清楚。 我希望占位符或模拟占位符的内容在输入所有字符之前保持可见！ 这意味着当我键入一个字符时，它不会消失。 它在尚未键入的字符上插入下划线。

Answer 1

占位符默认情况下不会像这样工作，因为这是一个坏主意。 以这种情况为例：

<input type="text" placeholder="Type something here!"/>

如果用户开始输入“ Hello，world！”，则过程将是：

"Hype something here!"
"Hepe something here!" ...
"Hellosomething here!" ...
"Hello world!ng here!"

如果您的占位符几乎不可见，那会很好，但是在大多数情况下，这将是丑陋的，也可能造成混淆-用户可能会导致他们相信他们必须准确输入占位符，否则他们可能会尝试清除占位符输入完全没有成功。

占位符只是为文本输入元素提供虚拟内容， 直到添加了真实内容。