开发者

how to assign default value in form input field for password?

开发者 https://www.devze.com 2023-03-23 00:01 出处:网络
I am trying to design a form in put field similar to the one in twitter i need to assign default value for the input fields, i did assign ,but for password the value displayed was in a password format

I am trying to design a form in put field similar to the one in twitter i need to assign default value for the input fields, i did assign ,but for password the value displayed was in a password format, how to show the default value of the password as 'password'. also the default value should only change when i type some value, it shouldn't disappear onclick.

<div class="editfield">
<label for="signup_password">Choose a Password <span class="required">*</span>
</label>
<div class="input_field">
<input type="password" minlength="6" value="Password" id="signup_password" 
   name="signup_password" onclick="this.value=''" 
   onblur="if(this.value=='') this.value='Choose a Password';">
<span id="pass1Info" class=""></span></div&开发者_高级运维gt;
</div>


Twitter is using a transparent password box. The default value is not really a default value but just the background of the password box.

.front-page form .holding input {
    -moz-transition: opacity 1s ease 0s;
    background-color: white;
    border: medium none !important;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
    color: #567792;
    opacity: 0.7;
}

As soon as you start to type the wrapper gets the class hasome and the font-size of the span in the background saying "password" is set to 0

.logged-out form .hasome .holder {
    font-size: 0 !important;
    opacity: 0;
}


Use keydown event to change the type from text to password and change the value to empty string

    <div><input value="Password"  onkeydown="if(this.type!='password'){this.type='password';this.value='';}" onblur="if(this.value=='') this.value='Choose a Password';">
</div>

check this fiddle http://jsfiddle.net/rajani5022/PE2qu/

0

精彩评论

暂无评论...
验证码 换一张
取 消