『Python Web框架之Django』第几节: AJAX
一. AJAX简介
AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。
注意: AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程）
AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。
- 同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求；
- 异步交互：客户端发出一个请求后，无需等待服务器响应结束，就可以发出第二个请求。
1. AJAX常见应用场景
- 搜索引擎根据用户输入的关键字，自动提示检索关键字。
- 注册时候的用户名查重。
当文件框发生了输入变化时，使用AJAX技术向服务器发送一个请求，然后服务器会把查询到的结果响应给浏览器，最后再把后端返回的结果展示出来。
- 整个过程中页面没有刷新，只是刷新页面中的局部位置而已！
- 当请求发出后，浏览器还可以进行其他操作，无需等待服务器的响应！
当我输入昵称之后, 把光标移动到其他表单项上时，浏览器会使用AJAX技术向服务器发出请求，服务器会查询名为conan的用户是否存在，最终服务器返回true表示名为conan的用户已经存在了，浏览器在得到结果后显示“该昵称已被他人使用”。
- 整个过程中页面没有刷新，只是局部刷新了；
- 在请求发出后，浏览器不用等待服务器响应结果就可以进行其他操作；
2. AJAX的优点
优点：
- AJAX使用JavaScript技术向服务器发送异步请求；
- AJAX请求无须刷新整个页面；
- 因为服务器响应内容不再是整个页面，而是页面中的部分内容，所以AJAX性能高；
二. jQuery实现的AJAX
1. jQuery发送AJAX的请求例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax测试</title>
</head>
<body> <button id="btn-1">提交</button> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script>
$('#btn-1').click(function(){
$.ajax({
url: '/ajax_deal/',
type: 'post',
data: {
username: 'conan',
password: 'conan',
},
success: function(res){
alert(res)
}
})
})
</script>
</body>
</html>
HTML部分代码
from django.shortcuts import render, HttpResponse def ajax_test(request):
return render(request, 'ajax_test.html') def ajax_deal(request):
username = request.POST.get('username')
password = request.POST.get('password')
print(username, password)
return HttpResponse('ok')
views.py
urlpatterns = [
re_path(r'^ajax_test', views.ajax_test),
re_path(r'^ajax_deal', views.ajax_deal),
]
urls.py
2. AJAX参数
3. 一个简单的例子
页面输入两个整数, 通过AJAX传输到后端计算出结果并返回.
HTML部分代码
views.py
urls.py
三. JS实现AJAX
四. AJAX请求设置csrf_token
五. AJAX上传文件
『Python Web框架之Django』第几节: AJAX的更多相关文章
- python web框架——扩展Django&tornado
一 Django自定义分页 目的:自定义分页功能,并把它写成模块(注意其中涉及到的python基础知识) models.py文件 # Create your models here. class Us ...
- 浅谈Python Web 框架：Django, Twisted, Tornado, Flask, Cyclone 和 Pyramid
Django Django 是一个高级的 Python Web 框架,支持快速开发,简洁.实用的设计.如果你正在建一个和电子商务网站相似的应用,那你应该选择用 Django 框架.它能使你快速完成工作 ...
- 两个Python web框架：Django & Tornado比较
就是说它作为 web 框架比 Django 简单,又支援异步 IO,且更不需要前端的 webserver ? 我已经混乱了, Tornado是 Nginx.Django.Node.js 的结合体?又或 ...
- [ 转载 ] Python Web 框架：Django、Flask 与 Tornado 的性能对比
本文的数据涉及到我面试时遇到过的问题,大概一次 http 请求到收到响应需要多少时间.这个问题在实际工作中与框架有比较大的关系,因此特别就框架的性能做了一次分析. 这里使用 2016 年 6 月 9 ...
- 选择一个 Python Web 框架：Django vs Flask vs Pyramid
Pyramid, Django, 和 Flask都是优秀的框架,为项目选择其中的哪一个都是伤脑筋的事.我们将会用三种框架实现相同功能的应用来更容易的对比三者.也可以直接跳到框架实战(Framework ...
- python web框架之django环境搭建
一.django环境搭建 https://www.djangoproject.com/download/ 下载适合自己的版本,在右边有压缩包版本的,也可以到git上去拽.我用的python27,下载的 ...
- Python web 框架之 Django 基础搭建服务
1. 需要安装 Python 和 Django 环境,Python 环境的安装我就不在多说了 2. 安装框架 Django Django 安装,推荐先装个 pip吧,easyinstall也可以,然后 ...
- 浅谈Python web框架
一.Python web框架 Web Framework,Ruby的世界Rails一统江湖,而Python则是一个百花齐放的世界,各种micro-framework.framework不可胜数,不完全 ...
- Python开发【第二十二篇】：Web框架之Django【进阶】
Python开发[第二十二篇]:Web框架之Django[进阶] 猛击这里:http://www.cnblogs.com/wupeiqi/articles/5246483.html 博客园 首页 ...
随机推荐
- Tkinter 之Scale滑块标签
一.参数说明 语法 作用 Scale(window, label="滑块") 滑块标题 Scale(window, label="滑块", from_=0) 滑 ...
- 使用C#代码调用Web API
1. POST POST的参数需要加上[FromBady],且参数只能一个 客户端提交数据的时候ContentType 为 application/x-www-form-urlencoded 或者 a ...
- VS Code 使用技巧[转载]
原文:VS Code 快捷键(VS Code Shortcuts.pdf) 常用 General 按 Press 功能 Function Ctrl + Shift + P,F1 显示命令面板 Show ...
- VS中卸载Visual Assist X
Tools=>Extensions and updates=>找到Visual Assist X 卸载:
- C# 读取文件内容
读取文件内容有三种方式 全部读取到字符串变量中 一次读取一行 全部读取到字符串数组中,每个数组元素存储一行文本 全部读取到字符串变量 string text = System.IO.File.Read ...
- Unix/Linux系统下获得时间戳函数
在Unix/Linux系统下,使用gettimeofday函数来获得当前系统的时间戳,精度可达到微秒(microsecond,即μs)级别. 通过结构体timeval来存放当前时间戳的信息: #ifn ...
- mysql插入数据时 insert IGNORE、ON DUPLICATE KEY UPDATE、replace into
转: mysql insert时几个操作DELAYED .IGNORE.ON DUPLICATE KEY UPDATE的区别 博客分类: mysql基础应用 mysql insert时几个操作DE ...
- web手工项目01-系统组织框架-测试流程-需求评审-测试计划与方案
回顾 SVN(定义,作用,使用操作) 软件缺陷(定义,表现形式,原因和根源,基本内容,跟踪流程) JIRA(基本介绍,使用者,工作流,问题,使用) 学习目标 掌握WAMP的环境搭建 掌握熟悉项目的步骤 ...
- UIScrollView实现自动循环滚动广告
实现效果如下: 功能说明: 程序运行,图片自动循环播放,采用定时器实现; 当用户用手势触摸滑动时,定时器的自动播放取消,停止触摸时,自动无限播放; 代码如下 : 采用封装视图,外部进行调用即可: 1. ...
- 手动mvn install指令向maven本地仓库安装jar包
mvn install:install-file -DgroupId=imsdriver(jar包的groupId) -DartifactId=imsdriver(jar包的artifactId) - ...