javaweb历史上最简单的使用Ajax判断用户名是否被注册(不跳转页面奥!)
关于前端:
使用jquery-3.3.1.js记得要导入奥---最后我会附加我的源码的
哎我也不多说了新手加菜鸟jquery真的不太懂!看代码吧!个别地方我会写上我对本程序的理解。
关于后台也就是servlet
后台并没有真正的链接数据库你懂得加入你测试的话还要建表,很麻烦,大致写了一个模板,以后你链接数据库,改代码的思路应该很简单!!我说的有道理吧!!简单的几句话看代码奥!!
index.jsp
//by萌萌的灰太狼 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>在此处插入标题</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery-3.3.1.js"></script>
<script type="text/javascript">
$(function () { //获取要判断的编辑框的id 之后就是一个被改变事件---
$(":input[name='username']").change(function () {
var val=$(this).val();
val=$.trim(val);
if(val!="")
{var url="${pageContext.request.contextPath}/valiateUserName";//这个地址是你要判断用户是否存在的后台
var args={"username":val,"time":new Date()};//这个参数是把编辑框里的内容传过去给后台了//这个参数你随便写相当于map类的键值对,再后台可以通过键得到里面的内容
$.post(url,args,function(data){
$("#message").html(data);})
//这句话的意思是返回的结果用html的格式写到了标签中显示!!
}
})
})
</script>
</head>
<body>
<form action="" method="post">
-------要判断用户是否存在的编辑框-------:<input type="text" name="username" size="60px" width="300px"><label id="message"></label>
<br>
</form> </body>
</html>
servlet 文件
package com.ajax;
import java.io.IOException;
import java.util.Arrays;
import java.util.List; import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; /**
* Servlet implementation class valiateUserName
*/
@WebServlet(asyncSupported = true, urlPatterns = { "/valiateUserName" })
public class valiateUserName extends HttpServlet { /**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub } /**
* @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);
response.setCharacterEncoding("utf-8");
request.setCharacterEncoding("utf-8");
String username=request.getParameter("username");
System.out.println("用户名"+username);
List<String> usernames =Arrays.asList("aaa","bbb","ccc");//相当于在这里建立了一个数组,下面的话如果数组里包括这几个单词那就前端提示信息用户已被注册!
String result=null;
if(usernames.contains(username))
{result="<font color='red'>该用户名已被使用</font>";
System.out.println(result);
}else {
result="<font color='red'>该用户keyi使用</font>";
System.out.println(result); } response.setContentType("text/html");//在这里是传回的文本格式为html格式
response.getWriter().print(result);//将提示信息传回前端jsp页面 }}
运行截图:

源代码链接失效评论补链接::https://pan.baidu.com/s/1c3L06Ow
javaweb历史上最简单的使用Ajax判断用户名是否被注册(不跳转页面奥!)的更多相关文章
- Ajax (Asynchronous javascript xml) 搜索框核心代码(JQuery) Ajax判断用户名存在核心代码 附:原生js的Ajax代码 其中有json的一句话解释
前端 <script type="text/javascript"> $(function(){ $("#tid").keyup(function( ...
- Ajax检测用户名是否已经注册
程序功能 当用户名输入完成(即用户名输入框失去焦点),利用Ajax检测用户名是否已经注册! 实现过程 利用Ajax向CheckUserServlet发送请求,判断该用户名是否可用.这里只是为了演示Aj ...
- Ajax验证用户名是否被注册
Ajax验证用户名是否被注册 var xmlHttp; function createXMLHttpRequest(){ // 创建XMLHttp请求对象 if(window.ActiveXObjec ...
- Asp.Net Mvc4 Ajax提交数据成功弹框后跳转页面
1.cshtml页面代码 @model Model.UserInfo @{ ViewBag.Title = "Edit"; var options = new AjaxOp ...
- .net中使用JQuery Ajax判断用户名是否存在的方法
//第一步:新建一个(*.aspx|*.html)Index.aspx页面 添加jquery 1 <html xmlns="http://www.w3.org/1999/xhtml&q ...
- ajax验证用户名是否被注册 ; ajax提交form表单
register.html 文件代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &quo ...
- javaweb利用ajax使登录窗口不跳转页面实现对账号密码的判断
和上一篇判断用户名是否被占用不跳转页面类似!利用ajax实现跳转,要导入jquery文件库!具体代码我会贴出来,注释在里面!!可以观摩一手!(代码我也留下链接,如果失效,评论补发,代码可能导入也无法使 ...
- 史上最简单的 SpringCloud 教程
史上最简单的 SpringCloud 教程 | 第一篇: 服务的注册与发现(Eureka)史上最简单的SpringCloud教程 | 第二篇: 服务消费者(rest+ribbon)史上最简单的Spri ...
- 史上最简单的 SpringCloud 教程 | 终章
https://blog.csdn.net/forezp/article/details/70148833转载请标明出处:http://blog.csdn.net/forezp/article/det ...
随机推荐
- 解决Ubuntu(linux)系统中PHP的curl函数无法使用的问题
我之前用的Windows的服务器,未出现问题,后来把服务器重装了系统,今天在学微信公众号获取信息的时候,发现curl函数出现了问题...... 解决方法 首先连接上服务器,找到/etc/php/7.0 ...
- java课堂第一次随机测试和课件课后动手动脑问题解决(2019-9-16 )
一.课堂测试 1.课堂测试:花二十分钟写一个能自动生成30道小学四则运算题目的 “软件” 要求 (1)减法结果不能为负数 (2)乘法结果不得超过一百,除法结果必须为整数 (3)题目避免重复: (4)可 ...
- Android中的Sqlite中的onCreate方法和onUpgrade方法的执行时机--(转)
原文:http://blog.csdn.net/jiangwei0910410003/article/details/46536329 今天在做数据库升级的时候,遇到一个问题,就是onCreate方法 ...
- Unnatural
1. 纪录片:非自然选择 1.1 CRISPR-Cas9的出现 1.2 故事1:先天性基因缺陷而失明的小孩 1.3 故事2:基因变异的蚊子 1.4 基因技术应用的现状 1.5 担忧 2. CRISPR ...
- Linux CentOS7 VMware 特殊权限set_uid、特殊权限set_gid、特殊权限stick_bit、软链接文件、硬连接文件
一.特殊权限set_uid root用户本身拥有对/etc/passwd的写权限,无可厚非:那普通用户呢,这里就用到了setuid,setuid的作用是“让执行该命令的用户以该命令拥有者的权限去执行” ...
- mysql dump 完全备
创建表: MariaDB [xuegod]> create database xuegod; MariaDB [xuegod]> use xuegod; MariaDB [xuegod]& ...
- 用python写测试数据文件
f是指向文件的指针,r是转义字符,可以让字符串中的\保持不被转义.路径点属性查然后加上当前文件. 'w'表示只写,‘r’表示只读. import random 导入random数 s = []开一个空 ...
- MySQL查询事务 杀死事务
遇到 com.mysql.jdbc.exceptions.jdbc4.MySQLTransactionRollbackException: Deadlock 查询: SELECT * FROM inf ...
- VUE - vue.runtime.esm.js?6e6d:619 [Vue warn]: Do not use built-in or reserved HTML elements as component i
<script> export default { name:'header' // 不要使用内置或保留的HTML元素 , 改为Header或者置或保留的HTML元素 ...
- CentOS下安装Orcale
以前没有安装过,最近安装了.感觉在Liunx安装真的超麻烦.这是技术文档,分享给大家. LINUX安装oracle数据库步骤: 1.安装依赖包 yum -y install gcc gcc-c ...