<%@ page
contentType="text/html;charset=GBK"
errorPage="error.jsp"
%>
<%request.setCharacterEncoding("GBK"); %>
<html>
<head>
<title></title>
<style type="text/css">
.STYLE4 {
font-size: 13px;
font-family: "宋体";
color: #244ac6;
line-height: 16pt;
}
</style>
<script language="JavaScript">
function login() {
var login=document.getElementById("login");
login.style.display=(login.style.display=="none")? "block":"none";
var log=document.getElementById("log");
log.style.display=(log.style.display=="none")? "block":"none";
}
</script>
</head>
<body>
<form action="AlbumServlet" method="post" name="myform" id="myform">
<center><br><br><br><br>
<table>
<tr>
<td>
<div id="log" class="STYLE4" style="display:block">点击图片登陆您的相册.....
<br></div>
<img src="image/ge.jpg" onclick="JavaScript:login();"><br>
<div id="login" class="STYLE4" style="display:none">
<table>
<tr>
<td><font color="#30358D"><b>用户名: </td></b><td>
<input type="text" name="username" id="username" style="width:120">
<br></font></td></tr>
<tr>
<td><font color="#30358D"><b>密 码: </td></b><td>
<input type="password" name="password" id="password" style="width:120">
<br></font></td></tr>
<tr height="10"><td></td></tr>
<tr>
<td>登录方式:</td>
<td align="center">
<input type="radio" size="25" name="gender" value="general" checked class="inputtext">普通用户
<input type="radio" size="25" name="gender" value="special" class="inputtext">管理员
</td>
</tr>
<tr>
<td>
<input type="submit" value="登陆">
<input type="hidden" name="action" value="userLogin">
</td>
<td>
<input type="reset" value="重置">
<a href="AlbumServlet?action=userRegistry">注册</a>
</td>
</tr>
</table>
</div></td></tr></table></center></form>
</body>
</html>
给为什么一开始只有“点击图片登陆您的相册.....”和照片, 点击后出现“用户名” 和 “密码”
我知道效果,但我更想知道的是 这个js 函数他到底是怎么工作的,参数怎么传,为什么一开始“用户名” “密码” 这些不解析出来,最好说明一步一步的js解释流程
contentType="text/html;charset=GBK"
errorPage="error.jsp"
%>
<%request.setCharacterEncoding("GBK"); %>
<html>
<head>
<title></title>
<style type="text/css">
.STYLE4 {
font-size: 13px;
font-family: "宋体";
color: #244ac6;
line-height: 16pt;
}
</style>
<script language="JavaScript">
function login() {
var login=document.getElementById("login");
login.style.display=(login.style.display=="none")? "block":"none";
var log=document.getElementById("log");
log.style.display=(log.style.display=="none")? "block":"none";
}
</script>
</head>
<body>
<form action="AlbumServlet" method="post" name="myform" id="myform">
<center><br><br><br><br>
<table>
<tr>
<td>
<div id="log" class="STYLE4" style="display:block">点击图片登陆您的相册.....
<br></div>
<img src="image/ge.jpg" onclick="JavaScript:login();"><br>
<div id="login" class="STYLE4" style="display:none">
<table>
<tr>
<td><font color="#30358D"><b>用户名: </td></b><td>
<input type="text" name="username" id="username" style="width:120">
<br></font></td></tr>
<tr>
<td><font color="#30358D"><b>密 码: </td></b><td>
<input type="password" name="password" id="password" style="width:120">
<br></font></td></tr>
<tr height="10"><td></td></tr>
<tr>
<td>登录方式:</td>
<td align="center">
<input type="radio" size="25" name="gender" value="general" checked class="inputtext">普通用户
<input type="radio" size="25" name="gender" value="special" class="inputtext">管理员
</td>
</tr>
<tr>
<td>
<input type="submit" value="登陆">
<input type="hidden" name="action" value="userLogin">
</td>
<td>
<input type="reset" value="重置">
<a href="AlbumServlet?action=userRegistry">注册</a>
</td>
</tr>
</table>
</div></td></tr></table></center></form>
</body>
</html>
给为什么一开始只有“点击图片登陆您的相册.....”和照片, 点击后出现“用户名” 和 “密码”
我知道效果,但我更想知道的是 这个js 函数他到底是怎么工作的,参数怎么传,为什么一开始“用户名” “密码” 这些不解析出来,最好说明一步一步的js解释流程
<div id="login" class="STYLE4" style="display:none">
//看看这句,这个div包含了你刚开始看不到后来出现的那些标签,DIV样式display:none,表示不现实出来,你可以看看页面源代码还是存在的,只是不展示出来。 function login() {//点击图片调用这个js函数
var login=document.getElementById("login");//找到上面说的那个div,
login.style.display=(login.style.display=="none")? "block":"none";如过样式是none就设为block,就是显示了,否则反过来
var log=document.getElementById("log");//这个是控制那个包含图片的div的,
log.style.display=(log.style.display=="none")? "block":"none";//效果同上
}
效果就是你点一下出来,再点一下隐藏,循环
如果login.style.display==none
那么就赋值BLOCK
反之login.style.display==block<div id="login" class="STYLE4" style="display:none">一开始的时候STYLE=display:none
所以这一块不会出现