Question

我正在使用Google自动填充地址API（此处为link）

我正在使用angular2，这是代码

HTML

<form autocomplete="off" method="post">
   <input autocomplete="false" name="address" type="text" style="display:none;">
  <div class="row">
   <div class="col-md-12">
     <div class="form-group">
       <label for="shippingAddress">Address*</label>
       <input id="shippingAddress" name="address" type="text"  autocorrect="off" [(ngModel)]="shipping.Address1" (blur)="checkIndirizzo()" autocapitalize="off" spellcheck="off" class="form-control" #search [formControl]="searchControl">
     </div>
  </div>
 </div>
</form>

我也试过这个

   <input autocomplete="false" name="address" type="text" style="display:none;">
  <div class="row">
   <div class="col-md-12">
     <div class="form-group">
       <label for="shippingAddress">Address*</label>
       <input id="shippingAddress" name="address" autocomplete="off" type="text"  autocorrect="off" [(ngModel)]="shipping.Address1" (blur)="checkIndirizzo()" autocapitalize="off" spellcheck="off" class="form-control" #search [formControl]="searchControl">
     </div>
  </div>
 </div>

谷歌自动填充工作完美，但浏览器自动填充功能涵盖谷歌地图自动填充的下拉列表。我想做的就是在这个文本输入上禁用浏览器自动完成功能，但我变得疯狂了。我读了一些解决方案，但没有人工作。

唯一有效的解决方案是设置密码类型的输入并设置

autocomplete="new-password"

但问题是，当我在文本框中书写时，我看到了点，但这并不好。

我也尝试使用隐藏的输入字段，但无所事事。我使用的是Chrome v 63.0.3239.84

任何帮助？

Answer 1

Chrome会在输入之前分析文本，并会根据单词触发自动填充UI。我发现在输入后放置标签可以解决问题。我在上方留一个空标签以保留空格，然后在

之后在标签上设置position: absolute;

我在

下面添加了一个示例

https://codepen.io/anthonyholmes/pen/YYvXEa

无法关闭浏览器CHROME自动完成功能

1 个答案: