如何在p-inputMask字段上禁用浏览器自动完成功能?

时间:2018-12-03 20:44:11

标签: angular typescript primeng

我正尝试在使用 p-inputMask 的字段上禁用浏览器自动完成。我可以在其他任何字段上使用 autocomplete =“ nope” ,效果很好,但是在这种特殊情况下似乎不起作用。有人可以告诉我我想念的东西吗?提前非常感谢!

请附上图片:

这是我的代码:

LIVE DEMO

<p-inputMask autocomplete="nope" name="maskValue" mask="(999) 999-9999" placeholder="(999) 999-9999" ></p-inputMask>

注意: 输入电话号码并单击发送后,您将看到浏览器自动完成。我正在尝试摆脱它,但我不知道如何。

3 个答案:

答案 0 :(得分:1)

您要为primeng组件赋予autocomplete属性。

当我检查p-inputmask的primeng源代码时,看不到自动完成的输入字段。它不会将autcocomplete = off绑定到html输入元素。

在这里您还可以从here进行检查

您可以为此打开一个问题。

您也可以尝试一下。将autocomplete = off添加到表单元素

<form autocomplete="off">
   <p-inputMask name="maskValue" mask="(999) 999-9999" placeholder="(999) 999-9999" ></p-inputMask>
   <button type="submit">Send</button>
</form>

答案 1 :(得分:0)

您尝试添加到autocomplete="off"时,autocomplete="nope"似乎不是自动完成属性的正确值。这是禁用字段自动完成的推荐方法。

可以将此属性添加到表单,以禁用表单中所有字段的自动完成功能。

More info on W3s

答案 2 :(得分:0)

autocomplete="off"可以在表单中使用,但是它将禁用整个表单的自动完成功能。

<form autocomplete="off">
   <p-inputMask name="maskValue" mask="(999) 999-9999" placeholder="(999) 999-9999" ></p-inputMask>
   <button type="submit">Send</button>
</form>

stackblitz here to disable autocomplete in entire form..

但是由于它会禁用整个表单的自动完成功能,因此,如果您希望使用单个p-inputMask完成自动填充功能,则可以以更通用的方式使用类似的内容-

在特定字段的setAttribute('autocomplete', 'off')

AfterViewInit

stackblitz to disable autocomplete only from inputmask