完整代码如下 ：
复制代码代码如下 :
<! 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 : lang ="en "lang ="en ">
<헤드>
<title> html 文本框提示效果 </title>
<스타일 유형 = "텍스트/CSS">
*{
여백 : 0px; 패딩 : 0px; font-size : 12px;
}
입력{
너비 : 100px; 높이 : 20px; 테두리 : 1px 고체 #ccc;
}
</스타일>
</head>
<body>
<script language = "javaScript">
기능 팁 (ID, str) {
var l = document.getElementById (id) .offSetLeft+120;
var t = document.getElementById (id) .OffSetTop;
document.getElementById ( "tips"). innerHtml = "提示 ："+str;
document.getElementById ( "tips"). style.left = l+"px";
document.getElementById ( "tips"). style.top = t+"px";
document.getElementById ( "tips"). style.display = "";
}
함수 unttips () {
document.getElementById ( "tips"). style.display = 'none';
}
</스크립트>
<div id = "tips"style = "위치 : 절대; 테두리 : 1px solid #ccc; 패딩 : 0px 3px; 색상 :#f00; 디스플레이 : 없음; 높이 : 20px; 선-리이트 : 20px; 배경 : #fcfcfc"> </div>
<br />
姓名 ： <입력 유형 = "text"id = "username"onfocus = "tips ( 'username', '姓名长度最多 16 个字符')"onblur = "outtips ()" />
<br />
密码 ： <입력 유형 = "비밀번호"id = "password"onfocus = "tips ( 'password', '密码长度必须在 3-18 位之间')"onblur = "outtips ()" />
</body>
</html>