一起了解AJAX

news2024/9/29 9:21:43

  • 注册账号的时候账号不能重复,通过AJAX实现实时验证当前注册的账号是否存在。

1.1register.jsp.


1.2HomeRegisterServlet.


2.JSON概述.

2.1何为JSON.

  • JSONJavaScript Object Notation (js对象标记) ,是一种轻量级的数据交换格式,是一个序列化的对象数组,易于人阅读和编写,同时也易于机器解析和生成 。


2.2为什么需要JSON.

  • 服务器响应给浏览器的数据应该是字符串类型 ,但是如果数据量比较大,我们就需要在服务器端将数据拼接成一个良好格式的字符串数据,响应给浏览器,浏览器根据格式再进行数据的解析和使用。而json格式的字符串就是一种良好的格式, 它能在 JavaScript 对象和字符串之间得以快速转换 。


2.3JSON格式介绍.

2.3.1JSON对象格式.

  • 格式:{"key":value,"key":value}

  • 格式解释:

    1. 对象用花括号包裹;

    2. 对象的内容是一组组键值对:key/value

    3. 键必须是字符串类型(加双引号),值可以是Java任意类型;

    4. 键值之间用末梢隔开,每对键值对之间用分号隔开。

  • 如:{ "uname":"王琳凯", "age":20, "info":"泰裤辣椒!" }。


2.3.2JSON数组格式.

  • 格式:[元素1,元素2,元素3,元素4,元素5];

  • 格式解释:

    1. 数组用中括号包裹;

    2. 数组的内容是任意类型的元素,元素之间用逗号隔开。

  • 如:[1,2,3,4,5,6,7,8,9,10].


2.3.3JSON对象数组格式.

  • 格式:[{"name":"张三","age":28},{"name":"李四","age":38},{"name":"王五","age":48}]

  • 格式解释:中括号里面包N哥裹花括号,每个花括号就是一个对象,花括号之间用逗号隔开。


3.JSON字符串的解析.

3.1前台解析后台传来的JSON字符串.

3.1.1后台处理.

  • 后台把 Java对象或者集合解析成 JSON字符串,并传到前台;

  • 需要通过第三方 jar包:fastjson 或者 jackson,课程使用 fastjson


3.1.2前端解析.

  • 前端接收后台返回的 json字符串,并解析成 js里面的对象或者数组;

  • 方式一:手动解析(不推荐):

  • 手动解析还有一种是:eval() 方法;

  • 方式二:自动解析(推荐):


3.2后台解析前台传来的JSON字符串.

3.2.1解析JSON数组情况.

  • 前端.

  • 后台:


3.2.2解析JSON对象情况.

  • 前端:

  • 后台:


4.AJAX+JSON实现自动补全.

4.1前端.

4.1.1HTML布局.


4.1.2js代码.


4.2后台.

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

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

相关文章

Eclipse教程 Ⅷ

Eclipse Debug 配置 创建和使用 Debug 配置 Eclipse Debug 配置类似于运行配置但它是用于在调试模式下开启应用。 打开 Debug 配置对话框步骤为:Run > Debug Configurations 。 从左侧列表中选择 "Java Application" 选项来选择要调试的 Java 代码。…

使用KubeSphere3.3在Ubuntu20.04的Kubernetes1.24上部署Word Press

使用KubeSphere3.3在Ubuntu20.04的Kubernetes1.24上部署Word Press 前言 之前已经部署了KubeSphere和K8S的基础环境:https://lizhiyong.blog.csdn.net/article/details/126236516 部署了大数据统一文件编排层Alluxio:https://lizhiyong.blog.csdn.net…

抖音seo源码开发开源--MySQL语言

源码开发是指基于开放源代码的软件或应用程序进行开发和定制。开放源代码是指软件或应用程序的源代码是公开的,任何人都可以查看、修改和分享。源码开发者可以从开放的源代码中学习和了解软件的工作原理,并基于自己的需求进行修改、定制和扩展。开放源代…

chatgpt赋能python:Python字符串首字母大写的方法

Python字符串首字母大写的方法 Python是一种高级编程语言,广泛用于科学计算、Web开发和网络编程等多个领域。在Python编程中,我们常常需要将字符串首字母大写,以符合一些规范或要求。在本文中,我们将介绍Python中将字符串首字母大…

效率至少提升数倍的office技巧

在现代办公室,WPS Office已成为无可替代的工具之一。然而,许多办公室员工却未能充分发掘WPS Office的强大功能和技巧。在快节奏的工作环境中,掌握一些WPS Office的技巧,将帮助员工们提高工作效率、改善文件处理和团队协作能力。下…

用CSS来做一个动画案例

今天来做这么一个案例 添加一个动画实现上下渐变滚动的效果 首先还是我们HTML部分&#xff0c;一个大盒子装着五个子元素 下面别在意&#xff0c;之前写的时候看到有个网站有这么个注解我就复制了下来哈哈哈 <div class"loader"><div class"slider&…

【SpringCloud——Docker】

一、什么是Docker 二、Docker的基本操作 1、Docker操作镜像 镜像名称一般由两部分组成&#xff1a;[repository]:[tag] 在没有指定tag时&#xff0c;默认是latest&#xff0c;代表最新版本的镜像。 1.1、启动Docker服务 systemctl start docker1.2、查看Docker运行状态 syst…

34.序列中删除指定数组以及编写代码过程中遇到的问题

描述 有一个整数序列&#xff08;可能有重复的整数&#xff09;&#xff0c;现删除指定的某一个整数&#xff0c;输出删除指定数字之后的序列&#xff0c;序列中未被删除数字的前后位置没有发生改变。 数据范围&#xff1a;序列长度和序列中的值都满足 1≤&#xfffd;≤501≤…

外贸商城ERP系统-海外跨境电商平台【APP+小程序+PC多端同步商城系统】

外贸商城ERP跨境电商系统是帮助打开海外贸易&#xff0c;线上出海贸易的平台&#xff0c;欢迎名片探讨开发跨境电商系统&#xff0c;相互学习成长。 一、基础功能架构 跨境全球跨境贸易多语言无货源多国货币一键铺货后台采集多商户一件代发视频直播带货国JI化UI面板国际多类型…

音视频专栏-DTSPTS

一&#xff0c;网上很多人都在讲dts和pts&#xff0c;但是么有几个人把这个问题讲清楚&#xff0c;讲明白的&#xff0c;甚至很多做了很多年的音视频开发的人都搞不明白&#xff0c;今天我把原理图整理下&#xff0c;和大家一起学习&#xff0c;如有问题&#xff0c;欢迎批评指…

电子科技大学编译原理复习笔记(六):自上而下的语法分析

目录 前言 重点一览 引言 语法分析的功能 语法分析的分类 自上而下分析方法 回溯分析法 回溯分析法例子 方法 存在的问题 产生的原因 特点 解决缺陷 消除回溯&#xff08;重点&#xff09; 递归下降分析器 递归下降分析法 递归过程的构造 扩充BNF 改进的递…

MATLAB机器学习:分类、回归和聚类的算法实现和模型优化

第一章&#xff1a;引言 机器学习是当今IT领域最热门的话题之一&#xff0c;它为我们提供了解决复杂问题的新方法。MATLAB作为一种功能强大的编程语言和环境&#xff0c;提供了许多用于机器学习的工具和函数。本文将介绍MATLAB中常用的分类、回归和聚类算法的实现&#xff0c;…

chatgpt赋能python:Python中将数字倒序:一种简单的方法提高代码效率

Python中将数字倒序&#xff1a;一种简单的方法提高代码效率 数字倒序是Python中一种实用的操作。网站开发者和数据分析师通常需要对数字进行反转&#xff0c;以使其更容易阅读和理解。虽然有多种方法可以实现数字反转&#xff0c;但在绝大多数情况下&#xff0c;使用Python中…

详解浏览器渲染原理及流程

今天来分享一下浏览器的渲染原理及流程。 前言 先来看看 Chrome 浏览器的多进程架构&#xff1a; 通常&#xff0c;我们打包出来的 HTML、CSS、JavaScript 等文件&#xff0c;经过浏览器运行之后就会显示出页面&#xff0c;这个过程就是浏览器的渲染进程来操作实现的&#xf…

Windows安装和启动SSH服务

前言 作者在做项目时遇到需要从Windows系统远程传文件到Ubuntu系统&#xff0c;Ubuntu系统这边使用了gFTP的文件传输工具&#xff0c;但是远程Windows时发现老是连接不上&#xff0c;后面发现是Windows这边没有开启SSH服务。 找了一些文章&#xff0c;结合自己的操作把配置方法…

基于工业互联网的RV1126+AI安防单目/双目高清视觉分析计数仪方案

1产品简介 产品介绍 单目视觉分析计数器是信迈科技基于单目图像分析以及深度学习算法研发的一款区域统计计数器。它可以精确的识别监控区域内的物体&#xff0c;统计区域内停驻的人数/车辆等&#xff0c;也可以统计区域内进入以及离开人数。它可适用于公交车&#xff0c;大巴&…

旧衣回收小程序开发需具备哪些功能呢?

旧衣回收小程序开发需具备哪些功能呢&#xff1f; 1、预约回收。只要通过手机小程序进行预约就可以进行上门回收旧衣&#xff0c;平台会根据预约的时间安排就近回收员上门进行回收废旧衣服。或者用户直接在小程序上点击捐赠&#xff0c;填写地址信息、时间、联系方式等待…

Android进阶 View的工作原理:源码分析View的三大工作流程

Android进阶 View的工作原理&#xff1a;源码分析View的三大工作流程 导语 想象一下&#xff0c;如果我们要画画&#xff0c;把画画的流程拆分的话&#xff0c;那么应该分几个部分呢&#xff1f;一般来说&#xff0c;专业的画师会进行提前构图&#xff0c;然后再进行绘画最后上…

docker hub 访问不了,可以进行拉取和推送,但是不能进行注册登陆了,界面找不到了,大家一起讨论看看有什么好的解决办法。

1&#xff0c;docker hub 不能访问了 在 oschina 的地方找找了文章和原因&#xff1a; https://www.oschina.net/comment/news/241627 2&#xff0c;通过啥方式进行访问呢&#xff1f; 目前配置源还是可以正常的pull 和 push 的。 {"data-root": "/data/doc…

数据链路层:可靠传输

1.数据链路层&#xff1a;可靠传输 笔记来源&#xff1a; 湖科大教书匠&#xff1a;可靠传输的基本概念 湖科大教书匠&#xff1a;可靠传输的实现机制–停止等待协议SW 声明&#xff1a;该学习笔记来自湖科大教书匠&#xff0c;笔记仅做学习参考 1.1 可靠传输的基本概念 接收…