本文档提供了一个使用ASP.NET实现的用户登录界面代码示例。该示例包括了基本的HTML结构，并通过JavaScript实现了用户名和密码输入框获得焦点时显示对应的提示信息功能。此外，还展示了如何通过简单的CSS样式设置输入框的外观。
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript">
function ShowDiv(obj,divName)
{
var x,y;
var oleft=parseInt(obj.offsetLeft);
var otop=parseInt(obj.offsetTop);
while(obj=obj.offsetParent){
otop+=obj.offsetTop;
oleft+=obj.offsetLeft;
}
x=oleft-4;
y=otop+18;
var obj=document.getElementById(divName);
obj.style.position = "absolute";
obj.style.left = x.toString()+"px";
obj.style.top = y.toString()+"px";
obj.style.display="";
}
function HideDiv(divName)
{
var obj=document.getElementById(divName);
obj.style.display="none";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
用户：</td>
<td>
<input id="Text1" onkeydown="if(event.keyCode==13)event.keyCode=9" style="border-right: 1px;
border-top: 1px; border-left: 1px; width: 100px; border-bottom: 1px; height: 18px;
border: 1px solid #999" type="text" size="14" name="UserName" onfocus="ShowDiv(this,'divRemName');HideDiv('divRemPwd');"></td>
<td width="8">
</td>
<td>
密码：</td>
<td>
<input id="Password1" onkeydown="if(event.keyCode==13)event.keyCode=9" style="border-right: 1px;
border-top: 1px; border-left: 1px; width: 100px; border-bottom: 1px; height: 18px;
border: 1px solid #999" type="password" size="14" name="UserPass" onfocus="ShowDiv(this,'divRemPwd');HideDiv('divRemName');"></td>
<td width="8">
</td>
</tr>
</table>
</div>
<div id="divRemName" style="display:none;color:#666666"><input type="checkbox" id="chkRemName" name="chkRemName" value="checkbox">记住用户名
</div>
<div id="divRemPwd" style="display:none;color:#666666"><input type="checkbox" id="chkRemPwd" name="chkRemPwd" value="checkbox">记住密码
</div>
</form>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
