在iOS7上停止Safari以提示保存卡数据

Question

我有一个客户的网站，提示他们在iOS7下保存卡详细信息。我完全没有找到关于如何或导致iOS决定这是正确的事情的事情 - 有没有人有任何想法？

Answer 1

我们遇到了这个问题。正如Guy Thomas所提到的那样，这是因为在CC字段的表单中有密码字段。

经过大量测试后，我确定在提交表单之前可以将密码字段切换为其他type（在我们的例子中，只是切换到hidden）。即使在选择＆＃34; Not Now＆＃34;之后，这也允许表单提交。在对话框中。

$("#submit").on("click", function(){
    try{
        $("input[type=password]").attr("type", "hidden");
    } catch(ex){
        try {
            $("input[type=password]").prop("type", "hidden");
        } catch(ex) {}
    }          
});

我添加了try / catches，因为根据browser / jquery版本，更改type属性会出错。

Answer 2

在对此进行了相当多的测试之后，我确定对用户实际输入的数据进行了某种分析。我删除了所有对信用卡，号码，cvv等的引用，并且在我输入“真实”卡号时仍然收到icloud钥匙串弹出窗口。一旦我开始输入“1234567890123456”等，弹出不会显示。

更有问题的是当用户点击“不现在”时，如果没有完整的页面刷新，表单将无法提交。我将其跟踪到输入type =“password”的表单。一旦我将类型更改为“text”，表单就会在用户点击“not now”后正确提交。

Answer 3

将autocomplete="off"添加到您的输入和表单中，它将停止保存您输入的数据。

Answer 4

似乎Safari需要提供信用卡信息的某种线索。如果您控制表单元素的名称，则将元素命名为与信用卡无关的内容：

这会提示自动填充：

<form action="test" method="post" id="credit">
    Name:<input type="text" name="cardholder"  />
    <br/>
    Credit Card Type:
    <select name="cardtype"  >
        <option></option>
        <option value="amex">amex</option>
        <option value="visa">visa</option>
        <option value="mastercard">mastercard</option>
    </select>
    <br/>
    Credit Card:<input type="text" name="cardnumber" />
    <br/>
    Expiration:<input type="text" name="expirationdate" />
    <br/>
    <input type="submit">
</form>

这不会提示：

<form action="test" method="post" id="credit" autocomplete="off" >
    Name:<input type="text" name="h" autocomplete="off"  />
    <br/>
    Credit Card Type:
    <select name="t" autocomplete="off"  >
        <option></option>
        <option value="amex">amex</option>
        <option value="visa">visa</option>
        <option value="mastercard">mastercard</option>
    </select>
    <br/>
    Credit Card:<input type="text" name="n" autocomplete="off" />
    <br/>
    Expiration:<input type="text" name="d" autocomplete="off"  />
    <br/>
    <input type="submit">
</form>