js顯示文本框提示文字的方法
更新時間:2015年05月07日 15:23:01 投稿:shichen2014
這篇文章主要介紹了js顯示文本框提示文字的方法,涉及javascript鼠標(biāo)事件及樣式操作的相關(guān)技巧,非常簡單實用,需要的朋友可以參考下
本文實例講述了js顯示文本框提示文字的方法。分享給大家供大家參考。具體實現(xiàn)方法如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js提示文字</title>
<style type="text/css">
input{
width:200px; height:24px;
line-height:24px; border:1px solid #999;
background:#ccc; margin:15px 0 0 100px;
padding:4px; color:#666;
}
.current{
background:#E0FEE4;
border:1px solid #093;
}
</style>
</head>
<body>
<input name="" type="text" value="請輸入姓名:"/><br />
<input name="" type="text" value="請輸入昵稱:"/><br />
<input name="" type="text" value="輸入驗證碼:"/><br />
<input name="" type="text" value="請輸入手機(jī)號碼:"/><br />
<input name="" type="text" value="請輸入電子郵件:"/>
<script type="text/javascript">
var aInp=document.getElementsByTagName('input');
var i=0;
var sArray=[];
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程序設(shè)計有所幫助。
相關(guān)文章
js中使用replace方法完成某個字符的轉(zhuǎn)換
這篇文章主要介紹了js中使用replace方法完成某個字符的轉(zhuǎn)換,比較實用,需要的朋友可以參考下2014-08-08
js對象轉(zhuǎn)json數(shù)組的簡單實現(xiàn)案例
本篇文章主要是對js對象轉(zhuǎn)json數(shù)組的簡單實現(xiàn)案例進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-02-02
javascript實現(xiàn)判斷鼠標(biāo)的狀態(tài)
這篇文章主要介紹了javascript實現(xiàn)判斷鼠標(biāo)的狀態(tài)的相關(guān)代碼,十分簡單實用,有需要的小伙伴可以參考下。2015-07-07
微信小程序map組件結(jié)合高德地圖API實現(xiàn)wx.chooseLocation功能示例
這篇文章主要介紹了微信小程序map組件結(jié)合高德地圖API實現(xiàn)wx.chooseLocation功能,結(jié)合實例形式分析了map組件調(diào)用高德地圖API接口獲取地理位置提示列表并返回location相關(guān)操作技巧,需要的朋友可以參考下2019-01-01

