html里输入框和密码框的提示文字怎么弄？

Question

效果如图；点击的时候，提示文字消失；失去焦点的时候提示文字出现，但是有内容输入后失去焦点也不显示提示文字；还有，密码框和文本框不一样啊，密码框的值不显现的。

Answer 1

html5 可以直接用 placeholder="请输入员工号"

js的话 你需要多制作的一个标签，比如span，覆盖在输入框的上方 鼠标进入的时候显示这个span，离开的时候就隐藏，原理就是这样

Answer 2

在行内写js。<input type="password" value="请输入员工号" class="kd_t" maxlength="20" onfocus="if(this.value==defaultValue){this.value=''}" onblur="if(this.value==''){this.value=defaultValue}"/>

<input type="text" value="请输入员工号密码" class="kd_t" maxlength="20" onfocus="if(this.value==defaultValue){this.value=''}" onblur="if(this.value==''){this.value=defaultValue}"/>
ss

Answer 3

<script type="text/javascript">
$(document).ready(function(){
$("#focus .input_txt").each(function(){
var thisVal=$(this).val();
//判断文本框的值是否为空，有值的情况就隐藏提示语，没有值就显示
if(thisVal!=""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span").show();
}
//聚焦型输入框验证
$(this).focus(function(){
$(this).siblings("span").hide();
}).blur(function(){
var val=$(this).val();
if(val!=""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span").show();
}
});
})
$("#keydown .input_txt").each(function(){
var thisVal=$(this).val();
//判断文本框的值是否为空，有值的情况就隐藏提示语，没有值就显示
if(thisVal!=""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span").show();
}
$(this).keyup(function(){
var val=$(this).val();
$(this).siblings("span").hide();
}).blur(function(){
var val=$(this).val();
if(val!=""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span").show();
}
})
})
})
</script>
给你一个网址，就是针对你这个问题，你好好看看http://www.lanrentuku.com/js/form-889.html#

Answer 4

js做吧 或者用html5

追问

有没有代码，参考下