Salesforce Web-to-Lead提交电话号码提示仅允许数字报错问题

问题描述 #

尝试配置多种不同type属性的电话号码输入框，提交Web-to-Lead线索时均收到如下报错：

Salesforce could not create this lead because of the reason listed below. For more information about this error or help with Web-to-Lead, please contact Customer Support.
Reason: Only Numbers are allowed in Phone number.

实际提交时输入的电话号码内容仅包含数字，无法定位问题产生原因，已尝试过的输入框代码配置如下：

<!-- type="phoneNumber" 配置 -->
<label for="phone">Phone</label><input  id="phone" maxlength="40" name="phone" size="20" type="phoneNumber" />

<!-- type="Number" 配置 -->
<label for="phone">Phone</label><input  id="phone" maxlength="40" name="phone" size="20" type="Number" />

<!-- type="text" 配置 -->
<label for="phone">Phone</label><input  id="phone" maxlength="40" name="phone" size="20" type="text" />

<!-- type="tel" 配置 -->
<label for="phone">Phone</label><input  id="phone" maxlength="40" name="phone" size="20" type="tel" />

问题根因 #

该报错和input标签的type属性无关，核心原因是提交给Salesforce的phone字段值中夹带了非数字字符，常见触发场景：

• 输入法/浏览器自动填充电话号码时，带入了全角数字、零宽空格、隐藏的分隔符（比如自动补的横杠、半角空格被样式隐藏）
• 表单内存在多个name="phone"的字段（含隐藏字段），提交时同名字段的值被拼接，其中某个字段携带了非数字内容

修复步骤 #

1. 输入框统一使用标准tel类型，弃用phoneNumber、大写开头Number这类非标准type值
2. 给电话输入框增加实时值清洗逻辑，输入/填充时自动过滤所有非数字字符，直接替换原有输入框代码即可：

<label for="phone">Phone</label>
<input  id="phone" maxlength="40" name="phone" size="20" type="tel" oninput="this.value = this.value.replace(/[^0-9]/g, '')" />

3. 全量排查表单代码，删除其余所有带name="phone"属性的重复项、隐藏项，避免同名字段值拼接
4. 若需要定位具体夹带的非法字符，可给表单加提交调试逻辑，打印字段实际传值和字符编码：

document.querySelector('form').addEventListener('submit', () => {
  const phoneContent = document.getElementById('phone').value;
  console.log(Array.from(phoneContent).map(char => `${char}:${char.charCodeAt(0)}`));
});

打印结果中字符编码不在48-57区间的即为非法字符，上述replace清洗逻辑会自动过滤这类内容，过滤后即可正常提交。

内容的提问来源于stack exchange，提问作者J Bree