为什么在使用Safari时，自动填充功能会在人物的地址中填写促销代码字段？

Question

我有一个以我的形式为促销代码的字段，这是来源

<input class="form-control helen-checkout-promo-input" type="text" placeholder="Apply a promo code" name="promo" autocomplete="new-promo">

不知何故，我似乎无法重现这一点，人们不断在这个领域输入他们的地址。我唯一能想到的就是自动完成。基于我看到的用户代理，它主要来自iPhone，有时候是MacOS上的Safari，这是其中之一

Mozilla / 5.0（iPhone; CPU iPhone OS 12_1_4，如Mac OS X）AppleWebKit / 605.1.15（KHTML，类似Gecko）版本/ 12.0 Mobile / 15E148 Safari / 604.1

我已经尝试将其设置为“off”，“new”，“new-promo”，同时删除属性，但我仍然每天都会看到这种情况多次发生。如何告诉Safari停止自动填充此字段？

（我知道这不是一个意外，因为在几个月的时间里，它每天发生的次数可能是10次，但修复它不是我的意思）

Answer 1

如果将输入设置为readonly，则自动完成将不会向该字段输入任何内容，因为无法将任何内容输入到该字段中。您可以在标记中放置另一个属性，以便在焦点上禁用readonly，因此当用户选择要输入其输入的字段时，readonly将被禁用。这样，自动完成不能尝试填写此字段，并且地址不会被输入到促销代码框中（当然，除非自动完成不是问题，问题只是一堆苹果爱好者尝试哄骗你）。

代码：<input class="form-control helen-checkout-promo-input" type="text" placeholder="Apply a promo code" name="promo" autocomplete="new-promo" readonly="" onfocus="this.removeAttribute('readonly');">

快乐的编码！