Currently, a very disgusting problem is encountered in developing a project. I originally entered the username and password in the login interface and logged in. After selecting to remember the password, the username and password entered in the login interface will be filled in the content page in the content page. The content page wants to create a new sub-account, which is really disgusting.
Of course, this will not happen under high-end browsers such as Firefox, IE8 or above. The problem is 360! Living up to expectations, this rookie has gone through the following attempts:
The first one: Cancel the automatic password in the browser.
Unfortunately, this thing has no response to 360. Damn, the first attempt failed! (Of course, even if it takes effect, as a developer, you cannot let all users take this action!)
The second type: add the autocomplete="off" attribute to input so that it does not automatically write the user name and password.
Unfortunately, this thing is also immune to 360, damn it!
The third type: dynamically modify the type attribute of input through js:
<input type="text" id="password" onfocus="this.type='password'" />
This time, the entered password was displayed directly under 360, which means that the one in onfocus was not executed. I made a short point and executed it below. I found that jquery reported an error. An uncaught exception type property can't be changed error. Unfortunately, the modification of type is not supported under IE.
The fourth type: Since you can't do it, you can only implement extraordinary means. If you don't let me change, then I won't change. I'll hide you and have a trick!
The code copy is as follows:
$(function(){
$("#PWD").focus(function(){
$(this).hide();
$("#password").val("").show().css("backgroundColor","#ffff").focus();
});
$("#password").blur(function(){
$(this).show().css("backgroundColor","#fff");
$("#PWD").hide();
});
$("#UN").focus(function(){
$(this).hide();
$("#userName").val("").show().css("backgroundColor","#ffff").focus();
});
$("#userName").blur(function(){
$(this).show().css("backgroundColor","#fff");
$("#UN").hide();
});
});
Note: Set background-color to #fff because 360 will give a yellow background by default.
Use an input box with id not userName and password respectively. The style is set to the same. When we click the fake input, let the real display.
The code copy is as follows:
<input id="UN" maxlength="26" type="text" />
<input id="userName" name="user.userName" maxlength="26" style="display:none;" type="text" />
<input id="PWD" maxlength="20" type="text" />
<input id="password" name="user.password" maxlength="20" style="display:none;" type="password" />
The mission is done!