close auto complete of edge input

Smile 0
Viewed 21

I want to write a login form.But the input always auto complete when I click it.How can I fix this with html,css or javascript.
this is my html code.

  <div class="container">
        <h1>Login Form</h1>
        <form autocomplete="off">
            <div class="form-control">
                <input type="text" required autoComplete="off">
                <label>Email</label>
            </div>
            <div class="form-control">
                <input type="text" required>
                <label>Password</label>
            </div>
            <button class="btn">Login</button>
            <p class="text">Don't have a account?<a href="#">Register</a></p>
        </form>
    </div>

I have set autoComplete="off",but It dosen't work.Please help me.Thanks a lot. enter image description here

css html
3 Answers

Note: In most modern browsers, setting autocomplete to "off" will not prevent a password manager from asking the user if they would like to save username and password information, or from automatically filling in those values in a site's login form. See the autocomplete attribute and login fields.

Source: MDN Docs AutoComplete

If you just want to get rid of the autocomplete while developing, I suggest opening it inside an incognito window, this will get rid of cache and the annoying autofill (Depending on your browser).

After a few Google Searches I found this, I have no idea if this will work haven't tested it, but you could give it a try:

  1. Add autocomplete="off" onto <form> element;
  2. Add hidden <input> with autocomplete="false" as a first children element of the form.

Source GitHub

FUZIION0

As mentioned in another answer, disabling autocomplete can be tricky in some browsers because despite what is coded on a page (such as autocomplete="off"), a browser may override this depending on a user's settings or browser extensions (such as password managers).

One trick is to use a value other than what would normally be accepted by the autocomplete attribute. So instead of off, you can use something like testing or noautocomplete. This likely isn't valid HTML, but does cause most browsers to disable autocomplete (possibly because the value is invalid).

<div class="container">
        <h1>Login Form</h1>
        <form>
            <div class="form-control">
                <input type="text" required autocomplete="noautocomplete">
                <label>Email</label>
            </div>
            <div class="form-control">
                <input type="text" required>
                <label>Password</label>
            </div>
            <button class="btn">Login</button>
            <p class="text">Don't have a account?<a href="#">Register</a></p>
        </form>
    </div>

EssXTee0

You should put autocomplete="off" instead of autoComplete="off"

userIvsZ0
Related