js显示文本框提示文字的方法
本文实例讲述了js显示文本框提示文字的方法。分享给大家供大家参考。具体实现方法如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>js提示文字</title>
<styletype="text/css">
input{
width:200px;height:24px;
line-height:24px;border:1pxsolid#999;
background:#ccc;margin:15px00100px;
padding:4px;color:#666;
}
.current{
background:#E0FEE4;
border:1pxsolid#093;
}
</style>
</head>
<body>
<inputname=""type="text"value="请输入姓名:"/><br/>
<inputname=""type="text"value="请输入昵称:"/><br/>
<inputname=""type="text"value="输入验证码:"/><br/>
<inputname=""type="text"value="请输入手机号码:"/><br/>
<inputname=""type="text"value="请输入电子邮件:"/>
<scripttype="text/javascript">
varaInp=document.getElementsByTagName('input');
vari=0;
varsArray=[];
for(i=0;i<aInp.length;i++)
{
aInp[i].index=i;
sArray.push(aInp[i].value);
aInp[i].onfocus=function()
{
if(sArray[this.index]==aInp[this.index].value)
{
aInp[this.index].value='';
}
aInp[this.index].className='current';
};
aInp[i].onblur=function()
{
if(aInp[this.index].value=='')
{
aInp[this.index].value=sArray[this.index];
}
aInp[this.index].className='';
};
}
</script>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。