Question

我正在尝试使用以下代码来使用信用卡的“Safari's AutoFill”。但它不起作用

<input type="text" autocomplete="cc-number">
<input type="text" autocomplete="cc-name">
<input type="text" autocomplete="cc-exp-month">
<input type="text" autocomplete="cc-exp-year">
<input type="text" autocomplete="cc-csc">

Answer 1

为了使其成功，您需要：

使用以下任何名称：addCreditCardNumber，cardNumber，cardnumber - 或 - 任何此ID：cardNumber，creditCardNumber，creditCardMonth，creditCardYear（可能有更多ID或名称可用）
使用带文本类型（不是数字类型）的输入
最重要的是，仅适用于https

希望这有帮助！

Answer 2

我使用这个ID解决了：

<input type="text" id="cardNumber">
<input type="text" id="cardHolder">
<input type="text" id="cardExpirationMonth">
<input type="text" id="cardExpirationYear">
<input type="text" id="cardCsc">

Answer 3

自动完成属性只能打开/关闭，您可以根据需要拥有自己的值，并且您可能遇到浏览器问题我建议您再次查看形式，它应该像.. !!

<form action="demo_form.asp" method="get" autocomplete="on">

Answer 4

我遇到了同样的问题，iPhone上的Safari只是拒绝填写信用卡到期字段。我尝试使用单个字段，以及MM和YYYY输入的单独字段。

根据https://html.spec.whatwg.org/multipage/forms.html#attr-fe-autocomplete，自动完成值取决于输入字段是否穿着期望地幔或锚定地幔。后者表示该字段是隐藏的输入字段，在这种情况下，不允许开启和关闭，但输入应来自自动填充字段名称列表，列在WhatWG页面。

根据我的理解，自动填充值应该提示浏览器，自动填充期间要插入哪些数据。

到目前为止，我无法让它在Safari上工作......

Answer 5

似乎HTML标准自动填充令牌也正常工作（在Safari 11.1中测试过）：

https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill

例如：

<input type="text" autocomplete="cc-name"> Name<br/>
<input type="text" autocomplete="cc-number"> Number<br/>
<input type="text" autocomplete="cc-exp-month" size="2">/<input type="text" autocomplete="cc-exp-year" size="4"> Exp<br/>
<input type="text" autocomplete="cc-csc"> CSC<br/>

我发现到期月份和年份应该是彼此相邻的，以便Safari找到它。 CSC字段不会被填充以维持另一层安全性。

Safari自动填充信用卡

5 个答案: