Google Chrome认为我的输入
<input
name="firstName"
id="firstName" type="text"
placeholder="John" font-size="16"
class="sc-fznKkj XyZMK"
>是一张信用卡，如自动完成字段检查器所示，并提供了一张已保存的信用卡。它在lastName字段上也是如此，另一个表单中的另一个数字类型字段也是如此。
我不明白的是，它在我们的开发环境中工作得和预期的一样，只在阶段中出错（两者几乎是相同的部署过程，相同的s3 + cloudfront托管，相同构建的相同代码）。
有线索吗？
更奇怪的是：将name字段更改为first-name而不是firstName可以解决这个问题。我不需要更改两个输入名称，只需要更改第一个输入名称即可。但是我应该可以随心所欲地命名我的字段吗？
1条答案
按热度按时间vql8enpb1#
在HTML表单中，
autocomplete属性用于告诉浏览器什么类型的数据应该进入特定的输入。(More info at MDN web docs .）
例如，对于名字，您应该使用
autocomplete="given-name"，对于姓氏，您应该使用autocomplete="family-name"。将这些属性添加到被错误识别的输入应该可以解决您的问题。
至于为什么有些输入没有
autocomplete属性，但仍然被正确识别：当没有找到autocomplete属性时，浏览器尝试“智能地”决定应该将什么放入该字段。要做到这一点，
name属性是最常用的。例如，如果它是username或password，浏览器可能会识别这些单词，因为它们是非常常见的输入描述。如果它是myinput6，那么浏览器将无法识别任何东西。在你的例子中，似乎浏览器识别了
name="first-name"，但识别略有不同的name="firstName"时遇到了麻烦。然而，正如你所说，你应该能够为你的name属性赋予任何你想要的值，为此，你应该使用autocomplete属性。