Multiple methods: Disable Automatic user name and password filling in browsers

At present, a disgusting problem occurs when a project is developed. I entered the user name and password on the login page and logged on. After selecting Remember password, <input type = "text" id = "userName"/> and <input type = "password" id = "password"/> enter your username and password in the Content Page. The content page is intended to create a new sub-account, which is really called a disgusting Barra ~~~

Of course, this will not happen in Firefox, IE8, or later advanced browsers. The problem lies in ! The cainiao has gone through the following attempts:

First, cancel the password automatically entered in the browser.
 

Unfortunately, this is no response to. Nima, the first attempt failed! (Of course, even if it takes effect, as a developer, this operation cannot be performed by all users !)

Type 2: add the autocomplete = "off" attribute to the input so that it does not automatically write the user name and password.

Unfortunately, this is immune, Nima's Nima!

Third: dynamically modify the type attribute of input through js:

<Input type = "text" id = "password" onfocus = "this. type = 'Password'"/>

This time, the entered password is directly displayed in section , that is, the password is not executed in the onfocus, and the following is executed in a short time. It is found that jquery reports an error. The error "uncaught exception type property can't be changed" is displayed. Unfortunately, type modification is not supported in IE.

Fourth: Since it is hard to do it, it can only be used in a very difficult way. If you don't want me to change it, I will not change it. I will hide you and come to a blind eye!
Copy codeThe Code is as follows:
$ (Function (){
$ ("# PWD"). focus (function (){
$ (This). hide ();
$ ("# Password"). val ("" mongo.show(mongo.css ("backgroundColor", "# fff"). focus ();
});
$ ("# Password"). blur (function (){
Certificate (this).show().css ("backgroundColor", "# fff ");
$ ("# PWD"). hide ();
});
$ ("# UN"). focus (function (){
$ (This). hide ();
$ ("# UserName"). val ("" mongo.show(mongo.css ("backgroundColor", "# fff"). focus ();
});
$ ("# UserName"). blur (function (){
Certificate (this).show().css ("backgroundColor", "# fff ");
$ ("# UN"). hide ();
});
});

Note: Set background-color to # fff because will give a yellow background by default.

Use an input box whose id is not "userName" or "password", and set the style to the same. When we click "False input", we can display it in real time.
Copy codeThe Code is as follows:
<Input id = "UN" maxlength = "26" type = "text" title = "Enter the user name"/>
<Input id = "userName" name = "user. userName "maxlength =" 26 "style =" display: none; "type =" text "title =" Enter the user name "/>
<Input id = "PWD" maxlength = "20" type = "text" title = "enter a password"/>
<Input id = "password" name = "user. password "maxlength =" 20 "style =" display: none; "type =" password "title =" enter the password "/>

Success!