$.post()函数

JQuery 中$ .get()函数的功能单一,专门用来发起 post 请求,从而向服务器提交数据。
语法:

$.post(url,[data],[callback])

参数名

参数类型

是否必选

说明

url

string


提交数据的地址

data

object


要提交的数据

callback

function


数据提交成功时的回调函数

$.ajax()函数

综合型函数
语法:

ajax({
  type:'',//请求的方式,get/post
  url:'',//请求的url地址
  data:{},//请求携带的数据
  success:function(res){}//请求之后的回调函数
})

接口

概念

使用 Ajax 请求数据时,被请求的 URL 地址,就叫做数据接口(简称接口),同时,每一个接口必须要有请求方式。

分析接口的请求过程

通过 get 方式请求接口的过程

11.2 Ajax基础_表单

通过 post 方式请求接口的过程

11.2 Ajax基础_ajax_02

接口测试工具

接口测试工具能让我们在不写任何代码的情况下,对接口进行调用和测试。

PostMan

接口文档

接口文档的组成部分:

接口名称:用来表示各个接口的简单说明,如登录接口、获取图书列表接口等。
接口URL:接口的调用地址。
调用方式:接口的调用方式。
参数格式:接口需要传递的参数,每个参数必须包含参数名称、参数类型、是否必选、参数说明这 4 项内容。
响应格式:接口的返回值的详细描述,一般包含数据名称、数据类型、说明 3 项内容。
返回示例:通过调用对象的形式,列举服务器返回数据的结构。

form 表单与模板引擎

form 表单的基本使用

什么是表单

表单在网页中主要负责数据采集功能,html 中的标签,就是用于采集用户输入的信息,并通过 form 表单的提交操作,把采集到的信息提交到服务器端进行处理.

表单的组成部分

表单标签
表单域
表单按钮

标签的属性

11.2 Ajax基础_ajax_03


11.2 Ajax基础_ajax_04


11.2 Ajax基础_前端_05

11.2 Ajax基础_前端_06


11.2 Ajax基础_数据_07

表单的同步提交

通过点击 submit 按钮,触发表单提交的操作,从而使页面跳转到 action URL 的行为叫做表单的同步提交。
缺点:
form 表单同步提交后,整个页面会发生跳转,跳转到 action 所指向的地址
form 表单同步提交后,页面之前的状态和数据会丢失。
解决方案:
表单只负责采集数据,Ajax 负责将数据提交到服务器。