How to Disable Autocomplete and Autofill for Chrome / Jquery

autocomplete="off"

doesn't work anymore. The only thing which works from 2019 is

autocomplete="new-password"

I finally found a solution by combining a few different answers.

STEP 1

In order to fix the autocomplete issue, you can add a dummy invisible input field as mentioned here. So your html should look something like this:

<input id="dummy_location" type="search" name="dummy_location" style='display: none;'>
<input id="location" type="search" name="location">

This will cause chrome autofill pop-up

STEP 2

To disable the autofill pop-up, we need to add an invalid value for the autocomplete attribute like this.

$("#fromcity_ac").attr({
     autocomplete: "chrome-off",
});

YOU CAN STOP HERE.

Chrome will work fine, however, autocomplete issue will pop up on other browsers such as firefox. To fix this you can edit step 2 by checking what browser is being used and setting an appropriate value for the autocomplete attribute.

var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edge") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");

// Autocomplete default value
var autocomplete = "chrome-off";
if (isIOSChrome) {
  // is Google Chrome on IOS
} else if (
  isChromium !== null &&
  typeof isChromium !== "undefined" &&
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false
) {
  // Is google chrome
} else {
  // Is firefox
  autocomplete = "off";
}

As of early 2022 this seems to work:

autocapitalize="off" autocomplete="off" autocorrect="off" autofocus="" role="combobox" spellcheck="false"

It is the technique used on the google home page search box.

autocomplete="off" to autocomplete="random-value". This is the temporary fix for now.

try this , this works for chrome

autocomplete="chrome-off"