Stop Safari on iOS7 prompting to save card data

问题

I have a client's site which is prompting them to save card details under iOS7. I can find absolutely nothing regarding how or what is causing iOS to decide this is the right thing to do - does anyone have any ideas?

回答1:

We were running into this exact issue. As Guy Thomas mentioned, it was due to having password fields in the form with the CC fields.

After lots of testing, I determined that the password fields could be switched to a different type before submitting the form (in our case, just switched to hidden). This allowed the form to submit even after choosing "Not Now" in the dialog.

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

I added the try/catches because depending on browser/jquery version, changing the type attribute would error.

回答2:

After performing quite a bit of testing on this I determined that there is some kind of analysis being done on the data actually input by the user. I removed all references to credit card, number, cvv, etc. and was still receiving the icloud keychain popup when I entered a "real" card number.. As soon as I started putting in "1234567890123456" and the like, the pop up would not display.

More problematic was when a user would click "not now" the form would not submit without a complete page refresh. I tracked this down to the form having an input of type="password".. As soon as I changed the type to "text", the form would properly submit after the user clicked "not now".

回答3:

Add autocomplete="off" to both your input and form and it will stop saving the data you entered.

回答4:

It seems that Safari needs some type of clue that you're submitting credit card info. If you control the name of the form elements, then name the elements to something unrelated to a credit card:

This prompts autofill:

<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>

This does not prompt:

<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>

来源：https://stackoverflow.com/questions/20210093/stop-safari-on-ios7-prompting-to-save-card-data

标签

html

safari

ios7