目录
JAVA中列表的使用:
通过List类构建出的一个list对象。
//1
List<String> s = new List();
// 2
class AAA
{
String a;
}
List<AAA> lis = new List();
List类后的<>中的东西,是列表每个元素对应的类型。
button标签的onclick属性,通过点击按钮触发对应的事件。
<button onclick="delrow(this)">删除</button>
delrow(this)是js对应的一个函数,this是吧当前的<button>标签的对象传进去。
<script type="text/javascript">
/*var _tr= document.getElementById("0");
var _table=_tr.parentNode;
_table.removeChild(_tr);
*/
function delrow(_obj){
_td=_obj.parentNode;
_tr=_td.parentNode;
_table=_tr.parentNode;
_table.removeChild(_tr);
}
//alert(_tr);
</script>
标签对象的删除只能是父节点(parentNode)除去(childNode)。
form标签
form标签里method属性可以是"get",也可以是"post",提交表单数据时用post。action属性对应的值是当表单提交之后返回的页面。
input标签的type,可以是text,也可以是password(不显示)。
button标签的type属性,submit就是提交表单数据。
入口页面,login.jsp代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'login.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link rel="stylesheet"
href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script
src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
</head>
<body>
<form method="post" action="userManage.jsp">
<div class="form-group">
<label for="username">Username</label>
<input
type="text" class="form-control" id="username"
placeholder="Username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input
type="password" class="form-control" id="password"
placeholder="Password">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<!-- <form method="post" action="userManage.jsp">
用户名 <input type="text"></input><br>
密 码 <input type="password"></input><br>
<button>登陆</button>
<input type="button" value="取消"></input>
</form> -->
</body>
</html>
操作界面代码,userManage.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%
class user
{
String name;
String tel;
String sex;
String password;
}
List<user> users=new ArrayList();
for(int i=0;i<10;i++ )
{
user u1=new user();
u1.name="张"+(i+1);
u1.sex="男";
u1.tel="13099999"+i+1;
u1.password="123456";
users.add(u1);
}
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'userManage.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<style type="text/css">
</style>
</head>
<body>
<a href="login.jsp">返回登录</a>
<table border="1">
<caption style="margin-bottom: 10px">用户管理</caption>
<tr>
<td>用户姓名</td>
<td>电话</td>
<td>性别</td>
<td>密码</td>
<td>操作</td>
</tr>
<%
for(int i=0;i<users.size();i++)
{
/*for(user u:users)
{
u.name;
}*/
%>
<tr id="<%=i%>">
<td align="center"><%=users.get(i).name %></td>
<td><%=users.get(i).tel %></td>
<td><%=users.get(i).sex %></td>
<td><input type="password" value="<%=users.get(i).password%>">
</input></td>
<td><button onclick="delrow(this)">删除</button></td>
</tr>
<%
}
%>
</table>
<script type="text/javascript">
/*var _tr= document.getElementById("0");
var _table=_tr.parentNode;
_table.removeChild(_tr);
*/
function delrow(_obj){
_td=_obj.parentNode;
_tr=_td.parentNode;
_table=_tr.parentNode;
_table.removeChild(_tr);
}
//alert(_tr);
</script>
</body>
</html>