Question

我试图在put字段中设计一个类似于twitter中的表单我需要为输入字段分配默认值，我确实已分配，但对于密码，显示的值是密码格式，如何将密码的默认值显示为“密码”。此外，默认值只应在我输入某个值时更改，它不应该在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>
</div>

Answer 1

Twitter正在使用透明密码框。默认值实际上不是默认值，而只是密码框的背景。

.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;
}

一旦你开始输入包装器，就会得到类的isome，背景中的span的字体大小说“password”设置为0

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

Answer 2

使用keydown事件将类型从text更改为password并将值更改为空字符串

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

检查这个小提琴 http://jsfiddle.net/rajani5022/PE2qu/

如何在表单输入字段中为密码分配默认值？

2 个答案: