JS点击输入框，框内文字消失

时间:2012-12-29 08:41来源:未知作者:admin 点击: 次

分享到：

提供一个常用在用户登录注册的地方的一个功能，JS点击输入框，框内文字消失代码，有需要的朋友可以参考一下。代码如下 titleJS点击输入框，框内文字消失实例/title script type=text/ja

提供一个常用在用户登录注册的地方的一个功能，JS点击输入框，框内文字消失代码，有需要的朋友可以参考一下。

代码如下

<title>JS点击输入框，框内文字消失实例</title>
<script type="text/javascript">
//得到焦点时触发事件
function OnFocusFun(element,elementvalue)
{
if(element.value==elementvalue)
{
element.value="";
element.style.color="#000";
}
}
//离开输入框时触发事件
function OnBlurFun(element,elementvalue)
{
if(element.value==""||element.value.replace(/s/g,"")=="")
{
element.value=elementvalue;
element.style.color="#999";
}
}
</script>
</head>
<body>
<div>欢迎学习建站学点击<strong>输入框</strong>框内文字消失实例</div>
<div>
<span>账号：</span>
<input type="text" value="请输入用户名" id="UserId" onfocus="OnFocusFun(this,'请输入用户名')" style="color:#999" onblur="OnBlurFun(this,'请输入用户名')"/>
</div>
<div>
<span>密码：</span>
<input type="text" value="请输入密码" id="Password" onfocus="OnFocusFun(this,'请输入密码')" onblur="OnBlurFun(this,'请输入密码')" style="color:#999" />
</div>
</body>
</html>