Home > Web Front-end > HTML Tutorial > Modify the type attribute of the input box_html/css_WEB-ITnose

Modify the type attribute of the input box_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:12:05
Original
1014 people have browsed it

<ul class="login_list"  id="web_login">                <li class="login_input">                    <input id="u" name="u"  tabindex="2" class="input_txt" type="text" value="User name" onFocus="this.value=''" onBlur="if(!value){value=defaultValue;}" />                </li>                <li class="login_input">                    <input type="text" class="input_txt2" value="Password" onfocus="if(this.value==defaultValue) {this.value='';this.type='password'}" onblur="if(!value) {value=defaultValue; this.type='text';}" />                </li></ul>
Copy after login


I want to make the input boxes blank when the mouse focus is on the two input boxes, but there is a problem when clearing the password. The password entered by the user should be " *****", it does not work under IE8, please help me solve it, thank you


Reply to the discussion (solution)

type is a read-only attribute and cannot be modified.
This is the only way

<script type="text/javascript"> function changeType(obj) {     obj.style.display = "none";     document.getElementById("d2").style.display = "";     document.getElementById("d2").focus(); } </script>
Copy after login

<ul class="login_list"  id="web_login">    <li class="login_input">        <input id="u" name="u"  tabindex="2" class="input_txt" type="text" value="User name" onFocus="this.value=''" onBlur="if(!value){value=defaultValue;}" />    </li>    <li class="login_input">        <input type="text" class="input_txt2" value="Password" onfocus="changeType(this)" onblur="if(!value) {value=defaultValue; this.type='text';}" />	<input type="password" class="input_txt2" id="d2" value="" style="display:none" />     </li></ul>
Copy after login

How can I modify the read-only attribute?

The password box must use type="password"

Refresh·························· ··················

type is a read-only attribute and cannot be modified.
That’s all.
JScript code

Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template