ajax第三例:用户名是否已被注册|学习笔记

简介: 快速学习ajax第三例:用户名是否已被注册

开发者学堂课程【Ajax:ajax第三例:用户名是否已被注册】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/31

ajax第三例:用户名是否已被注册


一.编写页面

二.编写servlet

.演示用户名是否被注册

四.继续编写servlet

.给用户名注册监听

六、尝试


.编写页面

ajax3.jsp

给出注册表单页面

给用户名文本框添加onblur事件的监听

获取文本框的内容,通过ajax4步发送给服务器,得到响应结果*如果为1:在文本框后显示"用户名已被注册”

如果为0:什么都不做!

.编写servlet

ValidateUsernameServlet

获取客户端传递的用户名参数>判断是否为itcast

是:返回1

否:返回0

.演示用户名是否被注册:

写一个页面:ajax3.jsp。

演示用戸名是否被注册

用户名:br/>

密 码:

此时表单已经没有问题了。

.继续编写servlet

1.获取参数username

2.判断是否为itcast

3.如果是:响应1

4.如果不是:响应0

String username = request. getParameter ("username") ;

if (username . equalsIgnoreCase ("itcast")) {

response.getwriter() .print("1") ;

} else {

response .getwriter() .print("0");

五.给用户名注册监听器

window.onload = function() (

//获取文本框,给它的失去焦点事件注册监听

var userEle = document. getElementById ("usernameEle") ;

userEle.onblur = function() {

//1.得到异步对象

var xmlHttp = createXMLHttpRequest() ;

//2.打开连接

xm1Http. open("POST", "", true) ;

//3.设置请求头: Content-Type

xmlHttp.getRequestHeader ("Content -Type", "application/x-www form-urlencoded");//4.发送请求,给出请求体

xmlHttp. send ("username="+ userEle.value) ;

//5.给xmlHttp的onreadystatechange事件注册监听

xmlHttp . onreadystatechange = function() {

if (xmlHttp. readystate == 4 && xmlHttp.status == 200) {//双重判断

image.png

//获取服务器的响应,判断是否为1

//是:获取span,添加内容:“用户名已被注册”

var text = xmlHttp. responseText;

if(text== "1") {

//得到span元素

var span = document . getElementById ("errorSpan");span. innerHTML = "用户名已被注册! ";

image.png

此时代码已经写完。

六、尝试:

如果更改用户名后还显示,此时需要增加判断,更改代码:

span. innerHTML =用户名已被注册! ";} else { span. innerHTML = "" 。此时已成功。

相关文章
layui框架实战案例(10):短信验证码60秒倒计时
layui框架实战案例(10):短信验证码60秒倒计时
467 0
|
域名解析 缓存 网络协议
DNS服务详解
DNS服务详解
1004 0
|
图形学 数据安全/隐私保护
最新的CorelDRAWX8序列号安装步骤教程
CorelDRAW Graphics Suite非凡的设计能力广泛地应用于商标设计、标志制作、模型绘制、插图描画、排版及分色输出等等诸多领域。作为一个强大的绘图软件,它被喜爱的程度可用事实说明:用作商业设计和美术设计的PC机几乎都安装了 。CorelDRAW让您轻松应对创意图形设计项目。市场领先的文件兼容性以及高质量的内容可帮助您将创意变为专业作品:从与众不同的徽标和标志到引人注目的营销材料以及令人赏心悦目的Web图形,应有尽有。
2750 0
2023阿里云企业邮箱收费标准价格表(不同版本报价)
2023阿里云企业邮箱收费标准价格表(不同版本报价)2023阿里云企业邮箱收费标准价格表,免费版企业邮箱0元,标准版企业邮箱原价600元一年、企业邮箱尊享版1400元一年、企业邮箱集团版9500元一年,目前收费版的企业邮箱可以享受9折或8折优惠,阿小云分享阿里云企业邮箱收费价格表、优惠活动及不同版本企业邮箱区别及选择方法
920 0
|
存储 自然语言处理 索引
现代信息检索——布尔检索
现代信息检索——布尔检索
现代信息检索——布尔检索
|
存储 自然语言处理 机器人
AIGC工程系列-LLM编程框架LangChain初探
前话:最近基于LLM的AIGC应用涌现,大家都在探索如何快速利用LLM去构建自己业务领域的应用。我们早前做了LLM应用框架这方面的一些调研,发现有一款LLM开发框架Langchain在开源社区异常火爆,短短5个月的时间已经达2w+star。于是我们针对该框架做了系统性的调研梳理,并沉淀到了语雀文档,当时只是为了方便团队成员理解和快速做业务Demo。最近有很多同学搜到了这篇调研文档,频繁要求帮忙开下
4290 0
|
存储 Linux Python
Python编程:读取pdf、pptx、docx、xlsx文件的页数
Python编程:读取pdf、pptx、docx、xlsx文件的页数
980 0
|
新零售 人工智能 安全
【资料合集】2017云栖大会·上海峰会回顾合集:PDF下载+现场视频
科技盛宴再临上海,6月10日-11日,云栖大会·上海峰会于上海跨国采购会展中心召开。 为了让大家get到现场嘉宾分享的技术和知识,小编特将本次峰会的部分PPT资料和视频整理出来,供大家下载、学习。
59339 0
|
人工智能 数据可视化 机器人
阿里云RPA(机器人流程自动化)干货系列之七:编写第一个RPA应用(可视化模式)
导读:本文是阿里云RPA(机器人流程自动化)干货系列之七,我们采用可视化开发模式编写第一个RPA应用(获取淘宝网宝贝),以及如何实现机器人自动化执行流程的过程。
7610 0