如何禁用Safari 7中的自动填充 [英] How to disable auto-fill in Safari 7

问题描述

我试图找到一种方法让Safari 7（测试版本7.0.2,7.0.3）尊重autocomplete =off属性。无论我尝试什么，它都会继续自动填充。

这是我们设置新用户的管理页面中的一个问题。我们的用户使用他们自己的用户名/密码继续保存。

以下是我们使用的缩略版本。我尝试将字段重命名为xxu和xxp，但自动填充似乎读取标签标题。

 < form novalidate autocomplete =off我已经使用了各种不同的标签，但它仍然以某种方式触发了自动填充。 > 
< div class =control-group> 
< label class =control-label>用户名< / label> 
< div class =controls> 
< input type =textname =xxuautocomplete =offrequired =required> 
< / div> 
< / div> 
< div class =control-group> 
< label class =control-label>用户名< / label> 
< div class =controls> 
< input type =passwordname =xxpautocomplete =offrequired =required> 
< / div> 
< / div> 
< / form> 
  

我在Apple的网站上找到了描述这个问题的文章。 https://discussions.apple.com/message/25080203#25080203

有没有人知道在Safari 7中禁用自动填充表单的其他方法？ （唉，这是我们对IE的期望）

感谢您的帮助。

解决方案

最近我们遇到了同样的问题。最重要的是，我们对Blur上的表单进行了AJAX验证。出于某种奇怪的原因，这会触发Safari再次自动填充我们的电子邮件输入字段。因此，每当您填写您想要的电子邮件时，Safari都会填写一封电子邮件，而不是它的首选。我们的解决方案

是为了让我们的表单不可能通过我们的表单。
$ b

几乎中断了Safaris（和Chromes）自动填充算法。

HTML：

 < div class =douchebag_safari> 
< input class =js-clear_fieldtabindex = -  1name =e-mailtype =email> 
< input class =js-clear_fieldtabindex = -  1name =Ecom_User_Passwordtype =password> 
< / div> 
  

CSS：

  .douchebag_safari {
 position：fixed; 
 width：1px;剩余
：-50px; 
} 
 .douchebag_safari输入{
 width：1％; 
 
  

JS：

<$ （'submit'，function（）{
use strict;
$（'。js-clear_field'）pre> $（'＃form'）。 .attr（'disabled'，'disabled'）;
}


它的作用是：我们在电子邮件和密码的输入字段中添加了排名较高（或相同？）的名称，并将它们隐藏在屏幕外。OnSubmit将禁用字段被排除在我们后端的POST之外。

缺点是用户在我们的表单上没有自动完成功能，但我们认为这对我们来说是值得的。

注意（假设您很在乎）：禁用Javascript的用户仍然会将这些字段包含在他们的POST中。需要允许这两个字段通过您的后端来防止错误。只要确保您没有对这些字段进行任何安全措施ty）的原因！

作为奖励，这解决了Chrome（35）认为密码字段上方的输入字段是用户名的错误。在我们的例子中，这是一个数字字段，给人奇怪的用户体验和bug。

I'm trying to find a way to make Safari 7 (tested with version 7.0.2, 7.0.3) respect the autocomplete="off" attributes. No matter what I try, it continues to auto-fill.

This is a problem for one of our admin pages where we set up new users. Our users keep saving over with their own username/password.

Here's an abbreviated version of the form we're using. I've tried renaming the fields to "xxu" and "xxp" but the autofill seems to read the label caption. I've fooled with various different labels but it still somehow triggers the auto-fill.

<form novalidate autocomplete="off">
     <div class="control-group">
          <label class="control-label">Username</label>
          <div class="controls">
               <input type="text" name="xxu" autocomplete="off" required="required">
        </div>
     </div>
     <div class="control-group">
          <label class="control-label">Username</label>
          <div class="controls">
               <input type="password" name="xxp" autocomplete="off" required="required">
        </div>
     </div>
</form>

I found this article on Apple's site that describes this problem. https://discussions.apple.com/message/25080203#25080203

Does anyone know of any other method for disabling auto-fill for a form in Safari 7? (Agh, this is the kind of thing we'd expect from IE)

Thanks for the help.

解决方案

We had the same problem recently. On top of that, we had a AJAX validation of our form happening onBlur. For some strange reason, this would trigger safari to autofill our email input field again. So every time you fill in the email that you want, Safari would fill in an email that it preferred instead. Making it impossible to go through our form.

Our solution

was to pretty much break Safaris (and Chromes) autofill algorithm.

HTML:

<div class="douchebag_safari">
    <input class="js-clear_field" tabindex="-1" name="e-mail" type="email">
    <input class="js-clear_field" tabindex="-1" name="Ecom_User_Password" type="password">
</div>

CSS:

.douchebag_safari {
    position: fixed;
    width: 1px;
    left: -50px;
}
.douchebag_safari input {
    width: 1%;
}

JS:

$('#form').on('submit', function () {
    "use strict";
    $('.js-clear_field').attr('disabled', 'disabled');
}

The jist of it is: We put input fields of type email and password with names that will rank higher (or same?) in Safaris autofill algorithm and hide them outside the screen. OnSubmit, the fields will be disabled and will thus be excluded from the POST to our backend.

The downside is that users won't have autocomplete on our form, but we decided that it was worth it in our case.

NOTE (assuming you care): Users with Javascript disabled will still get these fields included in their POSTs. Depending on your setup, you will need to allow these two fields to come through to your backend to prevent errors. Just make sure you don't do anything with these fields for security reasons!

As a bonus, this solved a bug where Chrome (35) assumed the input field above the password field is the username. In our case, it was a number field, giving strange user experience and bugs.

这篇关于如何禁用Safari 7中的自动填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！