AJAX相关知识复习

简而言之,就是可以用AJAX+HTML代替JSP页面,也可以进行异步交互,更新部分界面

Ajax案例

后端代码就是一个servlet文件,前端页面的代码也不是很常用,可以在下面这个网址这里找到相关代码:https://www.w3school.com.cn/js/js_ajax_intro.asp

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> <script>
//创建核心对象
var xhttp;
if (window.XMLHttpRequest) {
xhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//发送请求
xhttp.open("GET", "http://localhost:8080/ttCookieLogin_war_exploded/ajaxServlet");
xhttp.send();
//获取响应
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
alert(this.responseText);
}
}; </script> </body>
</html>

相关的创建核心对象、发送请求、获取响应的代码操作在上述网址中均能找到!

AJAX案例------验证用户是否存在

后端代码:

//selectUserServlet.java
package org.example.web.Ajax; import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException; public class selectUserServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String username=req.getParameter("username"); boolean flag=true; resp.getWriter().write(""+flag);
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doGet(req,resp);
}
}
<!--register.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册界面</title>
</head>
<body>
<center>
<tr>
已有账号?<a href="index.jsp">登录</a>
</tr>
<form action="registerServlet" method="post">
<tr>
<td>用户名:</td>
<td><input type="text" id="username" name="username" placeholder="请输入用户名"></td>
<br>
<div id="errorUsername">${register_msg}</div>
</tr>
<p>
<tr>
<td>密码:</td>
<td><input type="text" name="password" placeholder="请输入密码"></td>
</tr>
<p>
<tr>
<td>验证码:</td>
<td>
<input name="checkCode" id="checkCode" type="text">
</td>
<td><img src="checkServlet" id="checkCodeImg"></td>
<td><a href="#" id="changeImg">看不清?</a></td>
</tr>
<p>
<tr>
<button type="submit" value="提交">提交</button>
</tr>
</form>
<script>
document.getElementById("changImg").onclick=function(){
document.getElementById("checkCodeImg").src="/ttCookieLogin/checkServlet?"+new Date().getMilliseconds();
}
</script>
</center> <script>
//点击事件
document.getElementById("username").onblur=function(){
var username=this.value; //创建核心对象
var xhttp;
if (window.XMLHttpRequest) {
xhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//发送请求
xhttp.open("GET", "http://localhost:8080/ttCookieLogin_war_exploded/ajaxServlet?username="+username);
xhttp.send();
//获取响应
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
//alert(this.responseText);
//判断
if(this.responseText=="true"){
document.getElementById("errorUsername").style.display='';
}else{
document.getElementById("errorUsername").style.display='none';
}
}
};
}
</script>
</body>
</html>

核心代码在此:

Javaweb基础知识复习------AJAX的更多相关文章

  1. JavaWeb基础知识总结

    JavaWeb基础知识总结.   1.web服务器与HTTP协议 Web服务器 l WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. l Internet上供 ...

  2. 超详细的Java面试题总结(四 )之JavaWeb基础知识总结

    系列文章请查看: 超详细的Java面试题总结(一)之Java基础知识篇 超详细的Java面试题总结(二)之Java基础知识篇 超详细的Java面试题总结(三)之Java集合篇常见问题 超详细的Java ...

  3. spring 基础知识复习

    spring是一个分层架构,由 7 个定义良好的模块组成.Spring 模块构建在核心容器之上,核心容器定义了创建.配置和管理 bean 的方式. 组成spring框架的每个模块(或组件)都可单独存在 ...

  4. JavaScript进阶【三】JavaScript面向对象的基础知识复习

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. ZYNQ笔记(0):C语言基础知识复习

    ZYNQ的SDK是用C语言进行开发的,C语言可以说是当今理工类大学生的必备技能.我本科学C语言时就是对付考试而已,导致现在学ZYNQ是一脸懵逼.现在特开一帖,整理一下C语言的基础知识. 一.定义 1. ...

  6. [Java面试三]JavaWeb基础知识总结.

    1.web服务器与HTTP协议 Web服务器 l WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. l Internet上供外界访问的Web资源分为: • 静 ...

  7. JavaWeb基础知识

    一.WEB基本概念 1.1.WEB开发的相关知识 WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. Internet上供外界访问的Web资源分为: 静态web ...

  8. MySQL数据库基础知识复习

    现在是2020年寒假,这也是新年写的第一篇博客,用了十几天的时间自学了数据库基础部分,想总结一下得失同时并通过写博客来复习前面学的知识点. 个人: 1.本来是计划一周学完基础部分的178p但没能完成这 ...

  9. JavaWeb 基础知识补充

    软件架构 1. C/S: Client/Server 客户端/服务器端         * 在用户本地有一个客户端程序,在远程有一个服务器端程序         * 如:QQ,迅雷...        ...

  10. android基础知识复习——RelativeLayout布局属性、背景、半透明设置(XML设置)

    转自:http://blog.csdn.net/fansongy/article/details/6817968 复习布局与XML,写了一个空的登录界面.XML的注释我写在当行的后面了.程序运行图: ...

随机推荐

  1. OSS管理文件(Java)

    工具类 package com.panchina.util; import com.alibaba.druid.util.StringUtils; import com.aliyun.oss.Http ...

  2. 三分钟梳理TDengine安装部署的逻辑

      ​小 T 导读:TDengine,是涛思数据面对高速增长的物联网大数据市场和技术挑战推出的创新性的大数据处理产品,除却读写性能.存储压缩能力强大之外,还有安装简单.操作难度低等优势.今天我们就从常 ...

  3. 什么是跨域及如何解决、json和jsonp

    1.跨域: 出于浏览器的同源策略限制,同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互. 同源:即指在同一个域中,就是两个页面具有相同的协议(protocol),主机(host ...

  4. 【BOOK】解析库--Beautiful Soup

    1.安装bs4库 2.解析器 3.节点选择器 from bs4 import BeautifulSoup html = ''' <html> <head><title&g ...

  5. ??????FormDataAccess

    using Genersoft.Fms.Center.Pub.Com;using Genersoft.Platform.AdpBizIntegration.Entity;using Genersoft ...

  6. 1903021126-申文骏 实验一 19信计java-Markdown排版

    项目 内容 课程班级博客链接 19级信计班 作业要求链接 实验一 课程学习目标 大致学会Markdown排版 任务1:在博客园平台注册个人博客账号和加入班级博客 注册了博客园的个人账号,提交了博客申请 ...

  7. nohup 命令 追加输入日志或者覆盖输出日志

    nohup python3 -u botxiaohui.py >> botruninfo.log 2 >&1 & >>  是追加的输出 >    单 ...

  8. 方法(Java)

    什么是方法? 基本介绍 在其他语言中也叫函数 System.out.println();类名.对象.方法: Java方法是语句的集合,它们在一起执行一个功能 方法是解决一类问题的步骤的有序集合 方法包 ...

  9. Navicat Premium 12 安装破解过程 (经过测试)

    @ 目录 下载安装 下载 解压文件目录 安装使用步骤截图 1. 安装navicat120_premium_cs_x64.exe 软件 2. 解压Navicat.Premium 破解补丁.rar 3. ...

  10. GIS介绍(详细)一、什么是GIS?

    其他GIS空间分析文章 博主的参考书籍是科学出版社的地理信息系统原理(华一新.赵军喜等) 一.什么是GIS? 要说明什么是GIS,我们就得学习其基本术语,从而引出GIS的定义: 1.信息 狭义的信息论 ...