CSS 数字格式
CSS number format
我想知道是否可以使用 CSS 格式化输入字段中数字的可视化表示 (text/tel)。但不将符号传递给后端。
例如：(XXX) XXX-XXXX
其中 x 是任意数字。
我想传递给数据库 XXXXXXXXXX，但让用户在屏幕上看到格式，这样如果他们键入 1231231234，该字段就会显示。
(123) 123-1234
使用 css 有什么想法吗？
使用纯 CSS，你可以在 CSS2 中使用 :before 和 :after 选择器，或者在 CSS3 中使用 ::before, ::after 选择器
更多详细信息 here。但它有浏览器兼容性问题（IE 8.0 及以上）。而且不可能在单个文本字段中显示它。因此，纯粹的 CSS 解决方案是不够的。这不完全是 CSS 的限制，因为 CSS 用于演示、格式化和显示。它不是用来操纵的。那份工作是为 JavaScript 准备的。
解决方案之一可能是您使用 2 个字段。一个显示的文本字段和另一个隐藏的字段。显示的文本字段将从用户那里获取输入，您可以在文本更改事件中使用 JavaScript 代码对其进行格式化。隐藏字段将附加用户输入而不格式化。
这只是您可以进行格式化的众多方法之一。
<span>(</span><input name='area-code' type='number' lenght='3'><span>)<span><input name='first-three'><span>-</span><input name='last-four'>
等看到这个fiddlehttps://jsfiddle.net/tqnfbtxj/
我想知道是否可以使用 CSS 格式化输入字段中数字的可视化表示 (text/tel)。但不将符号传递给后端。
例如：(XXX) XXX-XXXX 其中 x 是任意数字。
我想传递给数据库 XXXXXXXXXX，但让用户在屏幕上看到格式，这样如果他们键入 1231231234，该字段就会显示。
(123) 123-1234
使用 css 有什么想法吗？
使用纯 CSS，你可以在 CSS2 中使用 :before 和 :after 选择器，或者在 CSS3 中使用 ::before, ::after 选择器 更多详细信息 here。但它有浏览器兼容性问题（IE 8.0 及以上）。而且不可能在单个文本字段中显示它。因此，纯粹的 CSS 解决方案是不够的。这不完全是 CSS 的限制，因为 CSS 用于演示、格式化和显示。它不是用来操纵的。那份工作是为 JavaScript 准备的。 解决方案之一可能是您使用 2 个字段。一个显示的文本字段和另一个隐藏的字段。显示的文本字段将从用户那里获取输入，您可以在文本更改事件中使用 JavaScript 代码对其进行格式化。隐藏字段将附加用户输入而不格式化。 这只是您可以进行格式化的众多方法之一。
<span>(</span><input name='area-code' type='number' lenght='3'><span>)<span><input name='first-three'><span>-</span><input name='last-four'>
等看到这个fiddlehttps://jsfiddle.net/tqnfbtxj/