Demo - Clear Initial Tip Text (V0.1)

最新推荐文章于 2024-05-31 22:24:45 发布

snow__ice

最新推荐文章于 2024-05-31 22:24:45 发布

阅读量83

点赞数

分类专栏： js 文章标签： JavaScript C C++ C# XHTML ViewUI

本文链接：https://blog.csdn.net/snow__ice/article/details/83632053

版权

js 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

版本号：V0.1

调用方法：

initValue("id","initial text");

id -- input/textarea 的id

initial text -- 初始提示文字

.c_txt 可以用于代表初始化文字的颜色。

缺陷：

使用class name作为判断依据…………不好。

没加trim去空格。

代码：

<!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>DEMO - Clear Initial Tip Text</title>
<style type="text/css">
dl, dt, dd {
	margin:0;
}
#txt, #txtarea {
	border:1px solid #999;
}
.bg_input {
	background:#deedfd;
}
.c_txt {
	color:#a1a1a1;
}
</style>
<script type="text/javascript">
	function initValue(name,text){
		var obj = document.getElementById(name);
		obj.className = "c_txt";
		obj.value = text;
		/*focus*/
		obj.onfocus = (function(){
			if(obj.value == text && obj.className == "c_txt"){
				obj.value = "";
			}
			obj.className = "bg_input";
		});
		/*blur*/
		obj.onblur = (function(){
			obj.className = "";
			if(obj.value ==""){
				obj.value = text;
				obj.className = "c_txt";
			}
			else{
				obj.className = "";
			}
		});
	}
	/*submit function for clear initial tip text*/
	function initVal(){
		for ( i= 0; i < document.tiptest.elements.length; i++){
			if(document.tiptest.elements[i].className =="c_txt"){
				document.tiptest.elements[i].value = "";
			}
		}
		return false;
	}
	document.onload = initValue();
</script>
</head>
<body>
<form action="post" name="tiptest" οnsubmit="return initVal();">
	<dl>
		<dt>单行文本框：</dt>
		<dd>
			<input id="txt" type="text" value="" />
		</dd>
		<dt>多行文本域：</dt>
		<dd>
			<textarea id="txtarea"></textarea>
		</dd>
	</dl>
	<div>
		<input type="submit" value="Submit" />
	</div>
</form>
<script type="text/javascript">
	initValue("txt","ab");
	initValue("txtarea","This is a textarea initial value.");
</script>
</body>
</html>

snow__ice

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Demo - Clear Initial Tip Text (V0.1)

版本号：V0.1调用方法：initValue("id","initial text"); id -- input/textarea 的idinitial text -- 初始提示文字.c_txt 可以用于代表初始化文字的颜色。缺陷：使用class name作为判断依据…………不好。没加trim去空格。代码：&lt;!DOCTYPE html PUBLIC ...
复制链接

扫一扫

专栏目录