事件处理模型或者委托模型
真正会java: java技术平台 JavaEE ==> WEB应用开发(MVC) SSM
事件:用户在程序界面所进行的操作,比如单击鼠标或者输入字符,称为用户事件
事件源:发生事件的对象,一般指某一具体的组件,比如:用户点击某Button,则此Button即为事件源
事件处理器:指的是确定控件如何响应事件的事件过程
TomCat中在首页面中js的应用
<form action=""> 姓名: <input type="text" name="name"><br> 密码: <input type="password" name="pass"><br> <input type="submit" value="登录"> <input type="reset" value="重置"> //点击按钮,会弹出对话框 <input type="button" value="点击" onclick="onClick()"> </form> //点击超链接,会弹出对话框 <a href="javascript:gogo()">弹出对话框</a> <script type="text/javascript"> function gogo(){ alert("弹出对话框") } function onClick(){ alert("你点击我干啥?邦邦两拳!!") } </script>
JSP全称Java Server Pages,是一种动态网页开发技术。它使用JSP标签在HTML网页中插入Java代码。标签通常以<%开头以%>结束。
JSP是一种Java servlet,主要用于实现Java web应用程序的用户界面部分。网页开发者们通过结合HTML代码、XHTML代码、XML元素以及嵌入JSP操作和命令来编写JSP。
JSP通过网页表单获取用户输入数据、访问数据库及其他数据源,然后动态地创建网页。
JSP标签有多种功能,比如访问数据库、记录用户选择信息、访问JavaBeans组件等,还可以在不同的网页中传递控制信息和共享信息
JSP是Java EE不可或缺的一部分,是一个完整的企业级应用平台。这意味着JSP可以用最简单的方式来实现最复杂的应用
展示(基于eclipse环境) mian.jsp文件:
/* 编码方式最好设置为UTF-8,这样程序可以识别中文 */ <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>哈哈哈哦</h1> //java代码片段 <% int x=20; double y=20.8; %> //输出x , y的值 <%=x %> <%=y %> </body> </html>
注意:
Java脚本插入
Java 代码段
<% …%>
Java声明语句
<%! …%>主要定义变量和成员方法 变量变为了全局变量
Java表达式语句
<%= %>主要用于输出结果
JSP指令
JSP动作标记
include动态包含 方法的引用,经过编译后把结果返回到主要页面,本身页面不运行
forword页面转向-------------->服务器端的跳转,地址栏不会改变
客户端的跳转:超链接,地址栏里会有变化
JSP内置对象
10 x 10表格
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Insert title here</title> </head> <body> //10 x 10表格,每一行都会有10个数字(从1到10) tr是行。td是单元格 <table border="1"> <tr> <td>1</td> <td>1</td> </tr> <tr> <td>2</td> <td>2</td> </tr> </table> <br> <table border="1"> <% for(int i=1;i<=10;i++) { %> <tr> <% for(int j=1;j<=10;j++) { %> <td> <%=j%> </td> <% } %> </tr> <% } %> </table> </body> </html>
<table border="1" align="center"> <% for (int i = 1; i <= 10; i++) { %> <tr> <% for (int j = i; j <= i * 15; j += i) { %> <td><%=j%></td> <% } %> </tr> <% } %> </table>
效果图:
注意:
<%@include file="lower.jsp"%> //把所引用的页面当做主页面的一部分,把结果显示在主页面 <jsp:include page="Active.jsp"></jsp:include> //Active.jsp经过编译把结果返回到主页面上 <jsp:forward page="second.jsp"></jsp:forward> //second.jsp经过编译,主页面会被替换成second.jsp这个页面
题目:编写JSP页面 example3_7.jsp、oddNumber.jsp和evenNumbers.jsp,example3_7.jsp页面中随机获取0~10的整数,当改数为偶数时转向页面evenNumber.jsp,否则转向页面oddNumber.jsp。访问example3_7页面。
example3_7.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% long num=Math.round(Math.random()*10); if(num%2==0){ System.out.println("随机产生偶数数字:"+num); %> <jsp:forward page="evenNumber.jsp"> <jsp:param value="<%=num %>" name="num"/> </jsp:forward> <% } else{ System.out.println("随机产生奇数数字:"+num); %> <jsp:forward page="oddNumber.jsp"> <jsp:param value="<%=num %>" name="num"/> </jsp:forward> <% } %> </body> </html>
evenNumber.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1 style="color:red;font-size:"30pt">我是偶数页</h1> 产生的是偶数: <%=request.getParameter("num")%> </body> </html>
oddNumber.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1 style="color:red;font-size="30pt">我是奇数页</h1> 产生的是奇数: <%=request.getParameter("num")%> </body> </html>
效果展示:
题目:编写两个页面example3_8.jsp和computer.jsp,在页面example3_8.jsp中使用include动作标记动态包含文件computer,并向它传递一个矩形的长和宽;computer.jsp收到参数后计算矩形的面积,并显示结果。运行example3_8.jsp页面。
example3_8
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>计算矩形的周长和面积</h1> <jsp:include page="computer.jsp"> <jsp:param value="18" name="chang"/> <jsp:param value="10" name="kuan"/> </jsp:include> </body> </html>
computer.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% String chang= request.getParameter("chang"); String kuan= request.getParameter("kuan"); double c=Double.parseDouble(chang); double k=Double.parseDouble(kuan); double zc=2*(c+k); double mj=c*k; %> 长方形的面积为:<%=mj %> <br> 长方形的周长为:<%=zc %>
效果展示:
项目要求
在login.jsp登录界面中输入用户名和密码,会到验证页面进行验证,用户名和密码在数据库中存在则会跳转到success.jsp成功登录页面,失败则会跳转到失败页面,提醒登录错误,重新登录
login.jsp页面:登录页面
<%@page import="java.util.Scanner"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>登录界面</h1> <form action="<%=request.getContextPath() %>/webTwo/validate.jsp"> <table> <tr> <td>账户输入:</td> <td><input type="text" name="user"></td> </tr> <tr> <td>密码输入:</td> <td><input type="password" name="passwd"></td> </tr> <tr> <td align="center"><input type="submit" value="登录"></td> <td align="center"><input type="reset" value="重置"></td> </tr> </table> </form> </body> </html>
validate.jsp:验证页面
<%@page import="myCn.CN"%> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>验证页面</h1> <% String User="tom"; String pwd="jenny"; String user=request.getParameter("user"); String passwd=request.getParameter("passwd"); boolean result=new CN().pd(user, passwd); if(result){ %> <jsp:forward page="success.jsp"></jsp:forward> <% } else{ %> <jsp:forward page="fail.jsp"></jsp:forward> <% } %> </body> </html>
success.jsp:成功页面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>登录成功</h1> 欢迎<%=request.getParameter("user")%>用户登录本网站 </body> </html>
fail.jsp:失败页面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>账号或者密码输入有误</h1> <a href="login.jsp">点我返回登录页面</a> </body> </html>
CN.java:连接数据库
package myCn; import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; public class CN { public Connection getCn(){ try { //通过初始化驱动类com.mysql.jdbc.Driver,该类就在 mysql-connector-java-5.1.26-bin.jar中 // 1.注册 JDBC 驱动 //Class.forName是把这个类加载到JVM中,加载的时候,就会执行其中的静态初始化块,完成驱动的初始化的相关工 //作 Class.forName("com.mysql.jdbc.Driver"); String url="jdbc:mysql://127.0.0.1:3306/np"; //2.打开连接 Connection conn=DriverManager.getConnection(url,"root","root123"); return conn; } catch (Exception e) { e.printStackTrace(); return null; } } public boolean pd(String name,String pass) { boolean flag=false; Connection conn=getCn(); try { //3.执行查询 Statement st = conn.createStatement(); String sql="select * from user"; //4.执行查询语句,并把结果集返回给集合ResultSet ResultSet rs=st.executeQuery(sql); while(rs.next()) { String n=rs.getString("name"); String p=rs.getString("pass"); if (name.equals(n)&&pass.equals(p)) { flag=true; } } } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); } return flag; } }
login.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> 输入密钥: <form action="validate.jsp"> <input type="password" name="pwd"> <input type="submit" value="提交"> </form> </body> </html>
validate.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% String pass = request.getParameter("pwd"); request.setAttribute("aa", "hahahhaha"); if(!"2019manpinde".equals(pass)){ //response.sendRedirect("error.jsp"); %> <jsp:forward page="error.jsp"></jsp:forward> <% } else{ out.print("2019年蛮拼的!!!"); } //request.setAttribute("aa", "hahahhaha"); 写在这里不指行,在if语句里,页面就已经跳走了 %> </body> </html>
error.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <h1>密钥错误</h1> <%= request.getAttribute("aa")%> </body> </html>
运行结果展示