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 ...
随机推荐
- 「快学springboot」16.让swagger帮忙写接口文档
swagger简介 官方的介绍 THE WORLD'S MOST POPULAR API TOOLING Swagger is the world's largest framework of API ...
- python面向对象之元类
目录 元类 造类 第一阶段 第二阶段 造对象 元类 元类(A) ---> 类(B) ---> 实例(C) 对于实例C而言,它是对象,它的类就是类B 对于类B而言,它其实也是对象,那它的类就 ...
- openstack的一台Nova主机上的虚拟机网络的配置
1.一台虚拟机器的网络配置,通过openstack/nova计算节点服务生成的虚拟机配置文件 <interface type='bridge'> <mac address='fa:1 ...
- JavaScript中的变量在内存中的具体存储形式
栈内存和堆内存 JavaScript中的变量分为基本类型和引用类型 基本类型是保存在栈内存中的简单数据段,它们的值都有固定的大小,保存在栈空间,通过按值访问 引用类型是保存在堆内存中的对象,值大小不固 ...
- Linux CentOS7 VMware 环境变量PATH、cp命令、mv命令、文档查看cat/more/less/head/tail——笔记
一.环境变量PATH PATH一个字符串变量,当输入命令的时候LINUX会去查找PATH里面记录的路径. 命令在这几个目录里面就不需要敲绝对路径 echo $PATH 例子:把/tmp/ 加到 $PA ...
- 如何确定Redis集群中各个节点的主从关系
1.首先通过命令(以192.168.203.141为例,-c代表集群的意思) ./redis-cli -h 192.168.203.141 -p 8001 -c 2.然后在输入 cluster no ...
- 使用Go语言一段时间的感受
作者 openkk 2012-03-04 18:26:58 文/Windstorm 有一段时间没更新了.最近在忙一个 Server+Client 的项目,Client 是 Android 手机,大概也 ...
- Docker介绍(一)
在TES GLOBAL,我们已经爱上Docker并从Docker的0.8版本开始就在生产环境中使用它.我们的很多开发者都参加了在DockerCon欧洲上的培训.下面是我们总结的一些tips,希望可以帮 ...
- 多门店4s管理系统
下载 系统登录用户名与密码:manage/123456
- 【LOJ2513】「BJOI2018」治疗之雨
题意 你现在有 \(m+1\) 个数:第一个为 \(p\) ,最小值为 \(0\) ,最大值为 \(n\) :剩下 \(m\) 个都是无穷,没有最小值或最大值.你可以进行任意多轮操作,每轮操作如下: ...