仅在某些字母后允许数字？

Question

我需要确保某个字段仅在某些默认字母字符之后使用数字，例如 XXX-XX-1234。这里 XXX-XX- 是不应删除的默认字符。在这些字母之后，我希望用户不能输入除数字以外的任何字符。

有没有一种巧妙的方法来实现这一点？

Answer 1

您也可以使用输入正则表达式模式

<input type="text" name="my_name"
  pattern="[A-Za-z]{3}-[A-Za-z]{3}-[A-Za-z]{3}-[0-9]{4}" title="my title">

在你的情况下（删除数字）

 <input type="text" name="my_name" value="ABC-DE" 
  pattern="[A-Za-z]{3}-[A-Za-z]{2}-" title="my title">

Answer 2

这是FIDDLE

我希望我可以对 @scaisEdge 的回答发表评论，因为我只是在此基础上添加了一些更有用的东西，但评论太多了：

HTML：

<form>
  <button>submit</button>
  <input type="text" name="name1" value="ABC-DE-" pattern="[A-Za-z]{3}-[A-Za-z]{2}-\d{4}$" title="LLL-LL-DDDD - L is any letter, D is any digit" />
  <input type="text" name="name2" value="XXX-XX-" pattern="XXX-XX-\d{4}$" title="XXX-XX-DDDD - D is any digit, rest as is" />
</form>

我以他的回答为基础，然后做了以下说明：

• 我在正则表达式模式的末尾添加了“\d{4}$”以强制输入 4 个数字，然后仅此而已
• 我添加了一个新的文本输入，显示了如何为字母/破折号部分强制使用明确的特定字符
• 我添加了带有有用模式提示的标题，因为这些提示会在模式被拒绝时显示在弹出窗口中
• 我将所有内容放在一个带有提交按钮的表单中，以展示它们如何协同工作

不该做什么

我花了很多时间“滚动我自己”的代码来制作一个文本输入版本，该版本专门限制了它前面的所有操作（输入更改、keydown、keyup、鼠标点击），只允许输入最后 4 位数字，仅此而已。它变成了一个“追逐极端案例”的游戏，我很快就确信使用经过开发人员社区彻底审查的插件或库是实现这种努力的方法，或者使用上面讨论的模式属性。

它不仅“垂直定向”于这种特定模式，而且即使经过很长时间熨平所有角落案例，我也失败了，它仍然坏掉了。

我什至解释了这些困难，并在这个答案中放置了代码和我的 FIDDLE，但意识到在 StackOverflow 上放置损坏的代码并不是一个好主意，所以我刚刚进行了适当的编辑以重做这个解释并摆脱我尝试过的替代路线的 FIDDLE 和代码。