javascript和jsp数据交换 jsp与js交互

转载

烂漫树林 2024-08-01 10:31:32

文章标签 javascript和jsp数据交换 java sql HTML 文章分类 JavaScript 前端开发

引言------jsp的概念是什么，是用来做什么，有什么作用，我想来查看的肯定和我本人一样，存在着众多的迷惑，那就跟随我的笔记，一起来了解jsp的本质是什么吧，虽然本人基础功底还不够。
一、jsp的概念
JSP全称Java Server Pages，是一种动态网页开发技术。它使用JSP标签在HTML网页中插入Java代码。标签通常以<%开头以%>结束。

JSP是一种Java servlet，主要用于实现Java web应用程序的用户界面部分。网页开发者们通过结合HTML代码、XHTML代码、XML元素以及嵌入JSP操作和命令来编写JSP。

二、既然谈到这，我们来说一说jsp的优势是什么？
1、与ASP相比：JSP有两大优势。首先，动态部分用Java编写，而不是VB或其他MS专用语言，所以更加强大与易用。第二点就是JSP易于移植到非MS平台上。
2、与纯 Servlet 相比：JSP可以很方便的编写或者修改HTML网页而不用去面对大量的println语句。
3、与SSI相比：SSI无法使用表单数据、无法进行数据库链接。
4、与JavaScript相比：虽然JavaScript可以在客户端动态生成HTML，但是很难与服务器交互，因此不能提供复杂的服务，比如访问数据库和图像处理等等。
5、与静态HTML相比：静态HTML不包含动态信息。
三、我将通过自己一段简单的代码块来说明一下jsp
第一步、我先关键了一个登录的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="css/login.css">
	

  </head>
  
  <body>
    <h2>登录页面 </h2>
    <div id="regiter">
    	<a href="regiter.jsp">注册页面</a>
    </div>
    <div>
    	<form action="dologin.jsp"  method="post">
    		<table>
    			<tr>
    				<td>用户名：<input type="text"  name="username"/> </td>
    				
    			</tr>    
    			<tr>
    				<td>密码：<input type="password" name="passward"/> </td>
    				
    			</tr>
    			<tr>
    				<td><span style="color:red">
    			<%-- 	<%  这是第一种方式来进行判断errors的值，进而返回要输出的值
    						下面的if代码块的优势大于上面的代码快
    							if(session.getAttribute("errors")!=null) {
    								out.print(session.getAttribute("errors"));
    							}
    				%> --%>
    						<% 
    							if(session.getAttribute("errors")!=null) {
    						%>
    							<%=session.getAttribute("errors") %>
    						<% 
    							}
    						%>
    						
    				</span></td>
    			</tr>
    			<tr>
    				<td><input type="submit" value="登录"/> </td>
    				<td><input type="reset" value="取消"/> </td>
    			</tr>     		
    		</table>    	
    	</form>
    </div>
  </body>
</html>

大家不要慌，认为代码量很大，其实上面有些地方是默认生成的，所以没有必要进行过多的紧张，说白了就是给body标签里写了静态页面的内容，同时还需要注意：每建立一个jsp页面，都需要进行修改这个值为“UTF-8”

javascript和jsp数据交换 jsp与js交互_java

第二步、将该页面提交到下一个页面，我们将它的名称命名为：“doLogin”，代码如下：

<%@ page language="java" import="java.util.*,com.afei.*" 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 'dologin.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">
	-->

  </head>
  
  <body>
    这里是处理登录界面
    <% 
    	request.setCharacterEncoding("UTF-8");
    	String username = request.getParameter("username");
    	String passward = request.getParameter("passward");
     	
     	DoLogin dologin = new DoLogin();
     	String result = dologin.doLogin(username, passward);
     	if(result.equals("success")) {
     		//登录成功
     		request.setAttribute("login", username); //将登录人的名字保存在请求范围
     		request.getRequestDispatcher("index1.jsp").forward(request, response); //转发
     		//response.sendRedirect("index1.jsp");
     	}else{
     		//登录失败
     		session.setAttribute("errors", "用户名密码不正确，请从新输入！");
     		response.sendRedirect("login.jsp");
     	}
     %>
     
     用户名：<%=username %>
  </body>
</html>

第三步、创建一个能被转发的页面，“index1.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 'index1.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">
	-->

  </head>
  
  <body>
    <h2>欢迎来到我的世界<%=request.getAttribute("login") %></h2>
  </body>
</html>

第四步、我们创建一个工具类，说白了就是JDBC的优化写法吧…，该页面的名称为“DbConnUtils.java”，其中里面包含了创建链接的方法，关闭的方法，以及处理结果集的方法。

package com.afei;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;


public class DbConnUtils {
	static String url = "jdbc:mysql://127.0.0.1:3306/hospial?useUnicode=true&characterEncoding=UTF-8";
	static String username = "root";
	static String passward = "root";
	public static Connection getConnection() {
		Connection conn = null;
		try {
			// 创建 数据库连接
			Class.forName("com.mysql.jdbc.Driver");
			conn = DriverManager.getConnection(url, username, passward);
			System.out.println("数据库创建链接成功了！！！");
		} catch (Exception e) {
			
			e.printStackTrace();
		}
		return conn;
		
		
	}
	public static void closeAll(ResultSet rs,Statement st,Connection conn) {
		if(rs!=null) {
			try {
				rs.close();
			} catch (SQLException e) {
			
				e.printStackTrace();
			}
		}
		if(st!=null) {
			try {
				st.close();
			} catch (SQLException e) {
			
				e.printStackTrace();
			}
		}
		if(conn!=null) {
			try {
				conn.close();
			} catch (SQLException e) {
			
				e.printStackTrace();
			}
		}
	}
	
	public static ResultSet getQureyList(Connection _conn,Statement _st,String _sql) {
		ResultSet rs = null;
		try {
			rs = _st.executeQuery(_sql);
		}catch(Exception e) {
			e.printStackTrace();
		}
		return rs;
	}
}

第四步、真正的建立链接数据库，该名称为“DoLogin.java”，代码如下：

package com.afei;

import java.sql.ResultSet;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;
public class DoLogin {
	// 验证登录是否成功
	public String doLogin(String _username,String _passward) {
		Connection conn=null;
		PreparedStatement pst=null;
		ResultSet rs=null;
		String result = "";
		String sql="select *  from loginuser where userName=? and userPwd=?";
		 conn = DbConnUtils.getConnection();
		try {
		 pst = conn.prepareStatement(sql);
			pst.setString(1,_username);
			pst.setString(2,_passward);
			rs = pst.executeQuery();
		} catch (SQLException e) {
			
			e.printStackTrace();
		}
		try {
			if(rs.next()) {
				result = "success";
			}else {
				result = "fail";
			}
			DbConnUtils.closeAll(rs, pst, conn);
		} catch (SQLException e) {
			
			e.printStackTrace();
		}
		return result;
	}
	
}

在本次内容的最后，看张图！

javascript和jsp数据交换 jsp与js交互_HTML_02