ajax简介：
AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程）
AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。
同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求；
异步交互：客户端发出一个请求后，无需等待服务器响应结束，就可以发出第二个请求。
ajax的基本使用方法：
# 前端向后端请求方式：1 浏览器手动输入网址（get请求），2 a标签的href属性（get请求），form表单（get/post请求，默认为get）
# ajax特点：异步提交、局部刷新
# 基本使用语法：
提交url （url：’...‘）
提交方式 （type: 'post')
提交数据 (data:{'''})
提交后通过回调函数得到的返回结果 (sucess:function(data){...})
# 基本使用示例：（ajax的默认传输数据的格式是urlencoded）
相关推荐：《Python视频教程》
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书管理系统</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<script src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/static/layui/css/layui.css">
<script src="/static/layui/layui.js"></script>
<script src="https://cdn.bootcss.com/sweetalert/2.1.2/sweetalert.min.js"></script>
</head>
<body>
<button class="btn btn-success" id="b1">AJAX测试</button>
<script>
{#绑定按钮点击触发ajax提交数据#}
$('#b1').on('click', function () {
$.ajax({ {#固定语法格式#}
url: '', {#不写默认朝当前页面发请求#}
type: 'post', {#请求方式#}
data : {'name': 'sgt', 'pwd': '123'}, {#发送的请求数据#}
{#这里的data就是回调函数success获取到的后端响应返回的数据#}
success:function (data) {
swal({
title: 'AJAX',
text: '模拟这里显示了返回的数据',
icon: 'success',
button: 'OK',
})
}
})
})
</script>
</body>
</html>我们知道ajax默认的传输数据格式是urlencoded，前面我们说过，ajax可以用json作为数据格式传输。
现在强调一点：前后端传输数据必须要求数据是什么格式就应该用对应的传输格式，一一对应去传输，否则Django解析数据出问题，以至于我们在前后端拿不到想要的数据。
所以：
第一：我们需要在ajax发送请求代码中指定发送数据格式：
contentType: 'application/json',
第二：后端获取json格式数据不再是request.POST,而是通过request.body(得到的是一个bytes类型的json格式数据），所以再处理一下：
res = json.loads(request.body.decode('utf-8')),这就得到前端ajax发送过来的json格式数据。
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用？
- 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了？
- 找不到素材资源介绍文章里的示例图片？
- 模板不会安装或需要功能定制以及二次开发？
发表评论
还没有评论，快来抢沙发吧！