如何在HTML输入字段上添加允许的符号?

Question

我有我自己的创建input标签，必须为电话号码字段:

<base-input
style="margin-bottom: 15px; width: 100%; max-width: 510px;"
v-model="phone"
type="tel"
placeholder="Mobile phone"
/>

如何只添加允许的符号(0-9和+)。我试图使用pattern="[0-9]+"，但它不起作用。此外，据我所知，它可以用正则表达式完成，但我不知道如何在这里使用

Answer 1

使用正则表达式^[0-9+]+$。它允许数字和+

例子

Answer 2

HTML输入标签有一个接收RegEx的模式属性。

适合您的情况:

<input
style="margin-bottom: 15px; width: 100%; max-width: 510px;"
v-model="phone"
type="tel"
placeholder="Mobile phone" 
pattern="[0-9+]+" title="Phone number - allowed symbols are (0-9 and +)" />

如果模式不匹配，则抛出标题。