Chrome 信用卡到期自动填充格式

Question

我在我帮助维护的网站上有一张信用卡登记表。后端编码为采用 MM/YY 格式的 2 位数到期月份和 2 位数年份。Chrome 似乎设置为以 MM/YYYY 格式应用信用卡信息，因此如果用户存储的 CC 过期日期为 05/2023，它将自动填充 05/20，并且由于 jquery 输入屏蔽将切断 23 部分。这会导致付款被拒绝，这是任何人都不愿意看到的。

这是表单的基本示例。

<form action="/">
  <h3>Label</h3>
  <div>
    <input name="CardHolderName" placeholder="Cardholder Name" type="text">
  </div>
  <div>
    <input name="CreditCardNumber" placeholder="Credit Card Number" type="tel">
  </div>
  <div>
    <label for="ExpirationDate">Expirion Date</label>
    <input id="ExpirationDate" name="ExpirationDate" placeholder="MM/YY" type="tel">
  </div>
  <div>
    <input name="Cvv2" placeholder="CVC" type="tel">
  </div>
</form>

我扫描了https://wiki.whatwg.org/wiki/Autocomplete_Types和https://html.spec.whatwg.org/multipage/form-control-infrastruct.html#autofill并发现 autocomplete="cc-exp"，以及一些关于格式的指导。

在已弃用的旧规范中，该格式在某种程度上与 Chrome 的做法相匹配，在 maxlength="7" 时提到了 MM/YYYY 格式。在这种情况下， maxlength="5" 应该给我我想要的，但它并不一致。例如，添加 maxlength="5" 在我的 jsfiddle 中有效，但在我们的网站上不起作用。然而，添加 autocomplete="cc-exp" 和 maxlength="5" 可以在桌面版 Chrome 上运行，但在 Android 上的 Chrome 上似乎不行。我的 Android 手机上的 Chrome 仍然会自动填充 MM/YYYY。

较新的规范表示格式为 YYYY-MM，这与 Chrome 所做的不匹配，因此没有帮助。没有提及任何其他可接受的格式。

这个小提琴（https://jsfiddle.net/JonathanN/j054kbgx/）显示了我原始形式的所有推导，以及我所看到的所有结果。如果有一种 100% 保证的方法告诉浏览器格式是 MM/YY，那就太好了。如果做不到这一点，了解这些表格如何对其他人起作用的更多信息也会有所帮助。

Answer 1

我遇到了同样的问题 - 检查了 Chrome 规范的自动填充并添加autocomplete="cc-exp-year"到表单字段修复了它。