javaee ajax请求后台 不刷新页面

news2024/9/23 21:31:15

在这里插入图片描述

jsp页面

Reg.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="js/jquery1.11.3.min.js"></script>
<script src="js/reg.js"></script>
</head>
<body>
  <form action="TestRegServlet" method="post">
   <pre>
    用户名:<input type='text' name='uname' /><span id="s1"></span>
   密码:<input type='password' name='pwd' />
   确认密码:<input type='password' name='repwd' />
 <input type='submit' name='sub' value='注册' />
  
  </pre>
  </form>


</body>
</html>

js代码

reg.js

/**
 * 
 */

$(function(){
	
	$(":text[name='uname']").blur(function(){
		
		//1.获得用户名
		var uname=$(this).val();
		
		//2.通过异步传输对象将用户名传到服务器,服务器查询数据库得到结果并返回
		
		$.get("CheckUnameServlet?uname="+uname,function(data){
			
			  if(data=="1")
				  $("#s1").html("该用户已存在");
			  else
				  $("#s1").html("可以注册");
		})
		
		
	})
	
	
})

后台代码

CheckUnameServlet

package com.yyy.servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.test.util.DbHelper;


/**
 * Servlet implementation class CheckUnameSevlet
 */
@WebServlet("/CheckUnameServlet")
public class CheckUnameServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public CheckUnameServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//禁止缓存
				response.setHeader("Pragma", "No-cache");
				response.setHeader("Cache-Control", "no-cache");
				response.setDateHeader("Expires", 0);
				
				
				String uname=request.getParameter("uname");
				
				String sql="select * from user where uname=?";
				
				List<Object> paramList=new ArrayList<Object>();
				
				paramList.add(uname);
				
				DbHelper dbHelper=new DbHelper();
				
				List<Map<String, Object>> list=  dbHelper.executeQuery(sql, paramList);
				
				if(list!=null && list.size()>0)
				    response.getWriter().print("1");
				else
					response.getWriter().print("0");
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}

TestRegServlet

package com.yyy.servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.test.util.DbHelper;


/**
 * Servlet implementation class RegServlet
 */
@WebServlet("/TestRegServlet")
public class TestRegServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public TestRegServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
				//response.getWriter().append("Served at: ").append(request.getContextPath());
			
				request.setCharacterEncoding("utf-8");
				response.setContentType("text/html;charset=utf-8");
				
				//1.获得用户输入
				String uname=request.getParameter("uname");
				String pwd=request.getParameter("pwd");
				
				//2.先判断用户名是否已存在 
				
				DbHelper dbHelper=new DbHelper();
				
				String sql="select * from user where uname=?";
				
				List<Object> paramList=new ArrayList<Object>();
				
				paramList.add(uname);
				
				List<Map<String, Object>> list=  dbHelper.executeQuery(sql, paramList);
				
				//3.不存在 则可以注册
				if(list==null || list.size()==0)
				{
					  String sql2="insert into user values(null,?,?)";
					  
					  List<Object> paramList2=new ArrayList<Object>();
					  
					  paramList2.add(uname);
					  
					  paramList2.add(pwd);
					  
					//4.处理结果
					  if(dbHelper.executeUpdate(sql2, paramList2)>0)
						  response.getWriter().println("注册成功");
					  else
						  response.getWriter().println("注册失败");			  
				}
				else
					response.getWriter().println("该用户已注册");
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}

DbHelper

package com.test.util;

import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Properties;

import javax.print.attribute.standard.RequestingUserName;

public class DbHelper {
	private Connection connection;
	
	private PreparedStatement preparedStatement;
	
	private ResultSet resultSet;
	
	public DbHelper()
	{
		getConnection();
	}
	//打开连接
	public void getConnection()
	{
		 try {			
			  if(connection==null || connection.isClosed())
			  {
				//将文件中的数据转到集合中 再从集合取数据
				Properties properties=new Properties();
				
				InputStream iStream=this.getClass().getResourceAsStream("/db2.properties");
				
			    properties.load(iStream);
			    
			    //获得集合中数据
			    String driver=properties.getProperty("driver");
			    
			    String url=properties.getProperty("url");
			    
			    String uname=properties.getProperty("uname");
			    
			    String pwd=properties.getProperty("pwd");
				  
				  
			    Class.forName(driver);
			 
			    this.connection= DriverManager.getConnection(url, uname, pwd);
			  }
			
		} catch (ClassNotFoundException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}		 
		 
	}	
	
	//执行 增 删 改 语句 返回受影响的行数
	public int executeUpdate(String sql,List<Object> paramList)
	{
		 getConnection();   //打开连接
		 
		 try {
			
			 this.preparedStatement=connection.prepareStatement(sql);
			
			 //给sql语句的参数赋值
			 if(paramList!=null)
			 {
				  for(int i=0;i<paramList.size();i++)
				  {
					  this.preparedStatement.setObject(i+1, paramList.get(i));
				  }
			 }
			 
			 return this.preparedStatement.executeUpdate();
			 
			 
			
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}finally {
			close();
		}
		 
		return 0;
	}
	
	//执行查询
	public List<Map<String, Object>> executeQuery(String sql,List<Object> paramList)
	{
		 getConnection();
		 
		 try {
			 this.preparedStatement=connection.prepareStatement(sql);
			
			 //给sql的参数赋值
			 if(paramList!=null)
			 {
				  for(int i=0;i<paramList.size();i++)
				  {
					    this.preparedStatement.setObject(i+1, paramList.get(i));
				  }
			 }
			 
			 //执行查询
			 this.resultSet= this.preparedStatement.executeQuery();
			 
			 //定义一个集合用来存放结果集中的数据
			 List<Map<String, Object>> resultList=new ArrayList<Map<String,Object>>();
			 
			 //读取结果集中的数据存入到集合resultList中
			 
			 //获得结果集中的列名
			 ResultSetMetaData resultSetMetaData= this.resultSet.getMetaData();
			 
			 
			 while(resultSet.next())
			 {
				 //存放结果集中的每一条记录  uid=1 uname="zhangsan" pwd="123"
				 Map<String, Object> map=new HashMap<String,Object>();
				 
				 for(int i=1;i<=resultSetMetaData.getColumnCount();i++)
				 {
					   //获得第i列的名称
					   String columnname=  resultSetMetaData.getColumnName(i);
				       //获得第i列的值
					   Object columnvalue=resultSet.getObject(columnname);
					   
					   map.put(columnname, columnvalue);
					   
				 }
				 
				 //将map存入到list中
				 resultList.add(map);
				 
			 }
			 
			 return resultList;
			
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}finally {
			close();
		}
		 
		return null;
		 
	}
	
	//关闭连接
	public void close()
	{
		 if(resultSet!=null)
			try {
				resultSet.close();
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
		 
		 if(preparedStatement!=null)
			try {
				preparedStatement.close();
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
		 
		 if(connection!=null)
			try {
				connection.close();
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
	}
}

properties文件

driver=com.mysql.jdbc.Driver
url=jdbc:mysql://localhost:3306/itstar?characterEncoding=utf-8
uname=itstar
pwd=yyy123456

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/697021.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Python】经过一个点P3的一条直线垂直于已知直线,求交点坐标

一个高中数学题目&#xff0c;已经点P1和点P2构成直线&#xff0c;经过P3点做已知直线的垂线&#xff0c;求垂线与已知直线的交点坐标。 p1 [100, 15] p2 [16, 85] p3 [-50, 100] if p2[0] - p1[0] 0:# p1 p2 构成垂线&#xff0c;那么垂直线就是一条水平线x p1[0]y p3…

kafka3.x 入门 常用命令(二)

创建主题 kafka-topics.sh --bootstrap-server hadoop100:9092 --create --partitions 1 --replication-factor 3 --topic first查看主题列表 kafka-topics.sh --bootstrap-server hadoop100:9092 --list查看主题详情 kafka-topics.sh --bootstrap-server hadoop100:9092 --…

element-ui—textarea多行输入框—字数限制及优化

属性作用 show-word-limit &#xff1a;是否显示数字显示 maxlength“300”&#xff1a;设置最大值 class“public-showWordLimit”&#xff1a; 优化数字的显示的位置 :autosize “{ minRows: 2, maxRows: 8 }” &#xff1a;根据输入字符长度设置动态高度 2.代码案例 <…

vue3+vite安装配置element-plus

配置 element-plus 1. 安装 yarn add element-plus element-plus/icons-vue2. 按需引入插件 yarn add unplugin-vue-components unplugin-auto-import -D3. 配置vite.config.ts // vite.config.ts import AutoImport from unplugin-auto-import/vite import Components fro…

MySQL数据库的主从复制与读写分离

MySQL数据库的主从复制与读写分离 一、主从复制原理1、MySQL支持主从复制类型2、主从复制的原理3、主从复制的架构4、mysql主从复制延迟4、slave从服务器的配置5、验证主从复制的效果6、从服务器的故障问题解决1、遇到Slave_IO_Running:NO的情况2、遇到Slave_SQL_Running&#…

C++ - 哈希的应用

前面的文章中我们讲解了如何进行哈希表的构建以及使用实现的哈希表来模拟实现unordered_map&#xff0c;在本文中我们将继续来讲解一下哈希的应用。 位图 问题引入 首先我们来引入一个问题&#xff1a;给40亿个不重复的无符号整数&#xff0c;没排过序。给一个无符号整数&am…

Pyside6-第十三篇-布局(最后一章废话-理论篇)

本篇Pyside6的第十三篇&#xff0c;新知识点&#xff0c;布局。 布局的方式有5种。着重挑选几种将 QVBoxLayout&#xff08;垂直布局&#xff09;&#xff1a;按垂直方向排列小部件。 QHBoxLayout&#xff08;水平布局&#xff09;&#xff1a;按水平方向排列小部件。 QGridLay…

关于函数和变量命名

标识符命名基本要求 标识符是指用来识别某个实体的一个符号&#xff0c;在不同的应用环境下有不同的含义。 在计算机编程语言中&#xff0c;标识符是用户编程时使用的名字&#xff0c;用于给变量、常量、函数、语句块等命名&#xff0c;以建立起名称与使用之间的关系。 C语言…

jdk代理和cglib代理(实例推导)

目录 jdk代理和cglib代理&#xff08;实例推导&#xff09;jdk动态代理Cglib动态代理总结 jdk代理和cglib代理&#xff08;实例推导&#xff09; 更深层的探究jdk和cglib动态代理的原理 jdk动态代理 jdk动态代理&#xff08;简单实现&#xff09; 定义一个House的房源类型接口…

05 2024考研408-计算机组成原理第五章-中央处理器学习笔记

文章目录 前言一、CPU的功能与基本结构1.1、CPU的功能1.2、运算器与控制器需要实现功能1.3、运算器的基本结构1.3.1、基本结构构成&#xff08;七个部分&#xff09;1.3.2、各个部件详细介绍①算数逻辑运算单元②通用寄存器组&#xff08;介绍数据通路的基本结构2个&#xff09…

Python教程(1)——python环境的下载与安装

Python教程(1)——python环境的下载与安装 下面是下载并安装Python解释器的具体步骤&#xff0c;非常详细&#xff0c;保姆级别的教程&#xff0c;初学者一步一步的按照操作。 下载python运行环境 访问官方网站 在浏览器中打开Python的官方网站&#xff0c;网址为 https://…

【PyTest】玩转HTML报告:修改、汉化和优化

前言 Pytest框架可以使用两种测试报告&#xff0c;其中一种就是使用pytest-html插件生成的测试报告&#xff0c;但是报告中有一些信息没有什么用途或者显示的不太好看&#xff0c;还有一些我们想要在报告中展示的信息却没有&#xff0c;最近又有人问我pytest-html生成的报告&a…

vue中由 window.open转为二进制流下载 遇到下载之后无法打开或乱码的坑 (responseType: ‘blob‘ 无效)

我项目中 request.js文件用的是 axios请求的. 如果使用 window.open 下载的话没有太多要求了,但是安全性不行. 如果使用 二进制流的话就需要设置: responseType: blob (设置请求返回类型) function exportData(orgId, personName, gender) {return request({url: /console/e…

时钟、时钟域

1.1 时钟 时钟信号是一个按一定电压幅度&#xff0c;一定时间间隔连续发出的脉冲信号。 脉冲信号之间的时间间隔称为周期&#xff1a;在单位时间内所产生的脉冲个数称为频率&#xff0c;频率的标准计量单位是Hz&#xff08;赫兹&#xff09; 每一次时钟脉冲到来&#xff0c;芯…

yolov8-03训练自己的数据集并保存推理结果

目标&#xff1a;将推理结果保存为xyxy形式&#xff0c;并以 pkl 格式保存 主要采取了两种方式&#xff0c;一种是阅读源码&#xff0c;通过CIL的方式保存结果。 一种是在IDE内&#xff0c;通过python代码的形式。 查看推理相关的源码&#xff0c;探索保存结果的相关信息。 在…

PySide6/PyQT 之应用程序最小化到系统托盘

前言 在使用 PySide6/PyQT 时&#xff0c;应用程序默认只会在任务栏展示一个初始图标。很显然&#xff0c;这是不够人性化的。 而在使用微信时候&#xff0c; 按下键盘的Esc&#xff0c;就是隐藏窗口&#xff1b;按下键盘的快捷键 Ctrl Alt W就是显示或隐藏窗口&#xff1…

【Axure高保真原型】多选树穿梭框选择器

今天和大家分享多选树穿梭框的原型模板&#xff0c;左侧多选树选择子级选项后&#xff0c;可以在右侧看到对应的标签&#xff0c;取消选中也会删除对应标签。多选树可以通过选中或取消选中父级自动选中或取消选对应的子级&#xff0c;也可以选中或取消选子级自动反选父级。右侧…

首届“天网杯”网络安全大赛启动 | 赛宁网安提供全面技术支撑

​​6月25日&#xff0c;由中华人民共和国公安部、天津市人民政府指导&#xff0c;天津市公安局、天津市委网信办、天津市工信局、天津市滨海新区人民政府、公安部第一研究所、国家计算机病毒应急处理中心共同主办&#xff0c;南京赛宁信息技术有限公司提供全面技术支撑的首届“…

文件后缀名和MimeType的映射关系

tomcat 的源码里边有。 打开 Tomcat官网 在 Download 菜单下找一个版本&#xff0c;比如 Tomcat 9&#xff0c;点进去&#xff0c;下载源码 找到 conf 目录下的 web.xml 文件 打开&#xff0c;里边有很多 <mime-mapping> 节点就是&#xff0c;总共一千多个吧 粘出来&…

银行卡如何大批量合并转到一个excel表中?并形成结构化数据

将银行卡图片转为Excel后&#xff0c;可以更方便地进行储存、管理和查看&#xff0c;其次也可以快速地进行数据的筛选、统计处理和分析&#xff0c;以提高工作效率&#xff0c;最后&#xff0c;还可以避免手工输入数据时出现的错误&#xff0c;提高数据的准确性。总之&#xff…