如何在web表单字段/输入标记上禁用浏览器自动完成？

如何在主要浏览器中禁用特定输入（或表单字段）的自动完成？

当前回答

我刚刚遇到了这个问题，并尝试了几次失败，但这一次对我有效（在MDN上找到）：

在某些情况下，浏览器将继续建议自动完成值即使autocomplete属性设置为off。这是意外的对于开发人员来说，这种行为可能非常令人困惑。真正的诀窍强制无完成是将随机字符串分配给属性像这样：

autocomplete="nope"

2016-03-22 19:38:37

其他回答

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        try {
            $("input[type='text']").each(
                function(){
                   $(this).attr("autocomplete", "off");
                });
        }
        catch (e) {
        }
    });
</script>

2015-11-16 13:02:37

这就是我们所说的文本框自动完成。

我们可以通过两种方式禁用文本框的自动完成：

按浏览器标签按代码要在浏览器中禁用，请转到设置

转到“高级设置”，取消选中复选框，然后单击“还原”。

如果要禁用编码标签，可以执行以下操作-

使用AutoCompleteType=“禁用”：

<asp:TextBox runat="server" ID="txt_userid" AutoCompleteType="Disabled"></asp:TextBox>

通过设置表单自动完成=“off”：

<asp:TextBox runat="server" ID="txt_userid" autocomplete="off"></asp:TextBox>

通过设置表单自动完成=“off”：

<form id="form1" runat="server" autocomplete="off">
    // Your content
</form>

通过使用.cs页面中的代码：

protected void Page_Load(object sender, EventArgs e)
{
    if(!Page.IsPostBack)
    {
        txt_userid.Attributes.Add("autocomplete", "off");
    }
}

通过使用jQuery

<head runat="server">
    <title></title>

    <script src="Scripts/jquery-1.6.4.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $('#txt_userid').attr('autocomplete', 'off');
        });
    </script>

2016-03-19 05:05:58

其想法是创建一个与原始字段同名的不可见字段。这将使浏览器自动填充隐藏字段。

我使用以下jQuery片段：

// Prevent input autocomplete
$.fn.preventAutocomplete = function() {
    this.each(function () {
        var $el = $(this);
        $el
            .clone(false, false) // Make a copy (except events)
            .insertBefore($el)   // Place it before original field
            .prop('id', '')      // Prevent ID duplicates
            .hide()              // Make it invisible for user
        ;
    });
};

然后只需$（“#登录表单输入”）.prpreventAutocomplete（）；

2016-09-02 10:14:34

我的jQuery解决方案。它可能不是100%可靠，但它对我有用。这个想法在代码注释中描述。

/***防止字段自动填充字段。*当关注具有自动完成功能的文本字段（值为：“off”、“none”、“false”）时，我们将该值替换为新的唯一值（此处为-“off forced-[TIMESTAMP]”），*浏览器在保存的值中找不到这种类型的自动完成，并且不提供选项。*然后，为了防止输入的文本保存在浏览器中，以便进行新的唯一自动完成，当字段失去焦点或用户按下Enter键时，我们将其替换为先前设置的文本。*@type｛｛init:*｝｝*/var PreventFieldsAutofill=（函数（）{函数init（）{events.onPageStart（）；}var事件={onPageStart:函数（）{$（document）.on（'fous'，'输入[autocomplete=“off”]，输入[autocomplete=“none”]，input[autocomplete=“false”]'，函数（）{methods.replaceAttrs（$（this））；});$（document）.on（'blur'，'input[data prev autocomplete]'，函数（）{methods.returnAttrs（$（this））；});$（document）.on（'keydown'，'input[data prev autocomplete]'，函数（事件）{if（event.keyCode==13 | | event.which==13）{methods.returnAttrs（$（this））；}});$（document）.on（'submit'，'form'，函数（）{$（this）.find（'input[data prev autocomplete]'）.each（函数（）{methods.returnAttrs（$（this））；});});}};var方法={/***将autocomplete和name属性的值替换为unique，并将原始值保存为新的数据属性*@param$输入*/replaceAttrs:函数（$input）{var randomString='off-forced-'+Date.now（）；$input.attr（'data-prev-autocomplete'，$input.aattr（'自动完成'））；$input.attr（'自动完成'，随机字符串）；if（$input.attr（'name'））{$input.attr（'data-prev-name'，$input.atr（'name'））；$input.attr（'name'，randomString）；}},/***恢复原始自动完成和名称值，以防止在浏览器中保存文本以获取唯一值*@param$输入*/returnAttrs:函数（$input）{$input.attr（'自动完成'，$input.atr（'数据-版本-自动完成'））；$input.removeAttr（'data-prev-autocomplete'）；if（$input.attr（'data-prev-name'））{$input.attr（'name'，$input.atr（'data-prev-name'））；$input.removeAttr（'data-prev-name'）；}}};返回{init：初始化}})();PreventFieldsAutofill.init（）；.输入{显示：块；宽度：90%；填充：6px 12px；字体大小：14px；线高：1.42857143；颜色：#555555；背景色：#fff；背景图像：无；边框：1px实心#ccc；边界半径：4px；}<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js“></script><form action=“#”><p><label for=“input-1”>Firts name without autocomplete</label><br/><input id=“input-1”class=“input”type=“text”name=“first name”autocomplete=“off”placeholder=“Firts name without autocomplete”/></p><p><label for=“input-2”>Firts name with autocomplete</label><br/><input id=“input-2”class=“input”type=“text”name=“first name”autocomplete=“given name”placeholder=“Firts name with autocomplete”/></p><p><button type=“submit”>提交表单</button></p></form>

2019-11-28 11:47:15

<input type="text" name="attendees" id="autocomplete-custom-append">

<script>
  /* AUTOCOMPLETE */

  function init_autocomplete() {

    if (typeof ($.fn.autocomplete) === 'undefined') {
      return;
    }
    // console.log('init_autocomplete');

    var attendees = {
      1: "Shedrack Godson",
      2: "Hellen Thobias Mgeni",
      3: "Gerald Sanga",
      4: "Tabitha Godson",
      5: "Neema Oscar Mracha"
    };

    var countriesArray = $.map(countries, function (value, key) {
      return {
        value: value,
        data: key
      };
    });

    // initialize autocomplete with custom appendTo
    $('#autocomplete-custom-append').autocomplete({
      lookup: countriesArray
    });

  };
</script>

2020-08-09 20:21:00

如何在web表单字段/输入标记上禁用浏览器自动完成？

推荐文章

最新文章

标签