Js has some restrictions on modifying the type attribute of input. You can modify the value of the input element before inserting the document stream. It is normal in ie and ff. However, if the input already exists on the page, its type attribute becomes a read-only attribute under ie and cannot be modified. It is still a read/write attribute in ff.
Today, I encountered a problem. The input box has the default value "password", but the word "password" will be removed when the focus is obtained, and the input will directly change to the "***" password type. Obviously, at the beginning, the input type was text and later changed to the password type. The intuitive idea is to use js to modify the type of input. However, this is not feasible in ie, so you can only change your mind to write two inputs, one text type, one password type, and listen for onfocus and onblur events. As follows:
Note: The script code should be written to html.
Copy codeThe Code is as follows:
<! Doctype html public "-// W3C // dtd html 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> production by Adam </title>
</Head>
<Style type = "text/css">
</Style>
<Body>
<Input name = "" type = "text" value = "password" class = "inputText_1" id = "tx" style = "width: 100px;"/>
<Input name = "" type = "password" style = "display: none; width: 100px;" id = "pwd"/>
<Script type = "text/javascript">
Var tx = document. getElementById ("tx"), pwd = document. getElementById ("pwd ");
Tx. onfocus = function (){
If (this. value! = "Password") return;
This. style. display = "none ";
Pwd. style. display = "";
Pwd. value = "";
Pwd. focus ();
}
Pwd. onblur = function (){
If (this. value! = "") Return;
This. style. display = "none ";
Tx. style. display = "";
Tx. value = "password ";
}
</Script>
</Body>
</Html>