safari 中的浏览器自动填充问题

Question

我正在设计付款表格。我需要将

credit card number

及其

expiry date

字段作为自动填充。

Chrome

浏览器完美运行而

Safari

没有 (

Safari doesn't recognize the expiry_date field to be autofill

).

这是我的两个字段。

<input type="text" id="card_number" />
<input type="text" id="expiry_date" placeholder="MM / YY" />

分离

month and year of the expiry date

可能会有解决方案，但我应该像现在这样。

Answer 1

https://cloudfour.com/thinks/autofill-what-web-devs-should-know-but-dont/

查看自动填充详细信息标记：

可以指定表单字段以考虑自动填写信用卡到期日期有两种方式：

• cc-exp

  ，对于 YYYY-MM 形式的日期，或者

• cc-exp-year

  和

  cc-exp-month

  分别用于持有 YYYY 和 MM 的各个字段。

Answer 2

我遇到了同样的问题。

问题是在safari中输入信用卡有效日期时，输入的是“MM . YYYY”而不是“MM / YYYY”。

Input 的

value.replace('.', '/');

解决了我的问题。

function setExpDate() {
    var expDateInput = document.querySelector('#expiry_date');
    expDateInput.addEventListener("input", updateValue);

    function updateValue() {
        expDateInput.value = expDateInput.value.replace('.', '/');
    }
}