JSP学习笔记-02

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> 
		密&nbsp;&nbsp;&nbsp; 码 <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>

JAVA中列表的使用：

button标签的onclick属性，通过点击按钮触发对应的事件。

form标签

入口页面，login.jsp代码：

操作界面代码，userManage.jsp:

猜你喜欢