A5下载 - 努力做内容最丰富最安全的下载站!

A5站长下载站

当前位置:A5下载 > 编程开发 > 网站开发 > js显示文本框提示文字的方法

js显示文本框提示文字的方法

时间:2015-05-07 16:25作者:zhao人气:90

本文实例讲述了js显示文本框提示文字的方法。分享给大家供大家参考。具体实现方法如下:

<!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="请输入手机号码:"/><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程序设计有所帮助。

标签显示,文本,提示,文字,方法,本文,实例,讲述了,显示,文本

相关下载

查看所有评论+

网友评论

网友
您的评论需要经过审核才能显示

公众号