代码实现动态显示和隐藏一个层,并根据不同的焦点设置层得值
1.JS名字为linkdesc.js代码如下:
function cleardesc(){
d=document.getElementById("description");
d.innerHTML="";
d.style.display="none";
}
function hover(e){
if(!e)var e=window.event;
whichlink=(e.target)?e.target.id:e.srcElement.id;
var x=250,y=0;
if(whichlink=="username"){desc="input username";y=20;}
else if(whichlink=="pass"){desc="input password";y=50;}
else if(whichlink=="reppass"){desc="input repPassword";y=80;}
d=document.getElementById("description");
d.innerHTML=desc;
d.style.left=x;
d.style.top=y;
d.style.display="block";
}
orderlink=document.getElementById("username");
orderlink.onmouseover=hover;
orderlink.onmouseout=cleardesc;
emaillink=document.getElementById("pass");
emaillink.onmouseover=hover;
emaillink.onmouseout=cleardesc;
complainlink=document.getElementById("reppass");
complainlink.onmouseover=hover;
complainlink.onmouseout=cleardesc;
2.JSP代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<script language="javascript">
function Check()
{
if(document.getElementById("username").value=="")
{
alert("输入用户名不能为空");
document.username.focus();
document.getElementById("regUser").value="输入用户名不能为空";
return false;
}
return true;
}
</script>
<head>
<title>注册页面</title>
</head>
<body>
<form method="post" action="practice.jsp" name="regForm" onSubmit="return Check()">
<div>
<table>
<tr><td>用户名:</td><td><input type="text" name="username" id="username" >
</td><td><p id="regUser">请输入用户名</p></td></tr>
<tr><td>密码:</td><td><input type="password" name="pass" id="pass"></td>
<td><p id="regPass">请输入密码</p></td></tr>
<tr><td>重复密码:</td><td><input type="password" name="reppass" id="reppass"></td>
<td><p id="regRepass">请再次输入密码</p></td></tr>
<tr><td><input type="submit" name="sub" value="提交"></td></tr>
</table>
<div id="description" style="display:none;position:absolute;background-color:black;color:white"></div>
</div>
</form>
<script language="JavaScript" type="text/javascript" src="linkdesc.js"></script>
</body>
</html>
这是怎么一回事?
1.JS名字为linkdesc.js代码如下:
function cleardesc(){
d=document.getElementById("description");
d.innerHTML="";
d.style.display="none";
}
function hover(e){
if(!e)var e=window.event;
whichlink=(e.target)?e.target.id:e.srcElement.id;
var x=250,y=0;
if(whichlink=="username"){desc="input username";y=20;}
else if(whichlink=="pass"){desc="input password";y=50;}
else if(whichlink=="reppass"){desc="input repPassword";y=80;}
d=document.getElementById("description");
d.innerHTML=desc;
d.style.left=x;
d.style.top=y;
d.style.display="block";
}
orderlink=document.getElementById("username");
orderlink.onmouseover=hover;
orderlink.onmouseout=cleardesc;
emaillink=document.getElementById("pass");
emaillink.onmouseover=hover;
emaillink.onmouseout=cleardesc;
complainlink=document.getElementById("reppass");
complainlink.onmouseover=hover;
complainlink.onmouseout=cleardesc;
2.JSP代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<script language="javascript">
function Check()
{
if(document.getElementById("username").value=="")
{
alert("输入用户名不能为空");
document.username.focus();
document.getElementById("regUser").value="输入用户名不能为空";
return false;
}
return true;
}
</script>
<head>
<title>注册页面</title>
</head>
<body>
<form method="post" action="practice.jsp" name="regForm" onSubmit="return Check()">
<div>
<table>
<tr><td>用户名:</td><td><input type="text" name="username" id="username" >
</td><td><p id="regUser">请输入用户名</p></td></tr>
<tr><td>密码:</td><td><input type="password" name="pass" id="pass"></td>
<td><p id="regPass">请输入密码</p></td></tr>
<tr><td>重复密码:</td><td><input type="password" name="reppass" id="reppass"></td>
<td><p id="regRepass">请再次输入密码</p></td></tr>
<tr><td><input type="submit" name="sub" value="提交"></td></tr>
</table>
<div id="description" style="display:none;position:absolute;background-color:black;color:white"></div>
</div>
</form>
<script language="JavaScript" type="text/javascript" src="linkdesc.js"></script>
</body>
</html>
这是怎么一回事?
解决方案 »
- 怎么获取这个节点
- 使用onchange事件怎调用数据库?
- 怎么实现选择控件和textbox控件显示内容的互动?
- 关于赋值的问题,在线等解答……
- 如何验证形如2006-12-20的字符串是一合法的日期?
- 现在VBSCRIPT的程序员提供了这样一段脚本。但是没见有JS的版本,很是郁闷。是不是没有人做过。100分献给做出来的高手.
- write打印代码的问题
- 怎样做一个随着网页移动而移动的浮动工具条,上面用图片或是文字显示点击“上”或“下”页面进行上下移动
- 求救! 自动分号
- 由“动态”构造的表格,怎样设置每个单元格的属性??高手请进!(新人,只有这么多分了,帮帮我)
- 急求城市选择层
- 求一段是否确定删除的js代码
初始是display:none可以触发么?