标签：function get args request ajax Ajax POST
Ajax简介
特点:异步提交,局部刷新
ajax不是一门新的技术并且有很多版本，我们目前学习的jQuery版本(版本无所谓，本质都一样)
基本语法
$.ajax({
url:'' 填的是后端地址,三种填写方法,与form标签的action一致
type:'post' 请求方式,默认是get
date:{'v1':v1Val,'v2':v2Val} 发送给后端的数据
success:function(args){ 后端返回结果之后自动触发args接收后端返回的数据
$('#d3').val(args)
}
})
Ajax普通写法
实现效果：在网页两个input框输入数字，第三个input框是结果，使用Ajax调用数据还在
视图层:
def index(request):
if request.method == 'POST':
v1 = request.POST.get('v1') # 接收发过来的数据
v2 = request.POST.get('v2')
v3 = int(v1) + int(v2)
return HttpResponse(v3) # 发挥计算的结果
return render(request, 'index.html')
模板层:
<input type="text" id="d1"> + <input type="text" id="d2"> = <input type="text" id="d3">
<button id="subBtn">点我发送ajax</button>
<script>
$('#subBtn').click(function () {
let v1Val = $('#d1').val();
console.log(v1Val)
let v2Val = $('#d2').val();
console.log(v2Val)
$.ajax({
url:'',
type:'post',
data:{'v1':v1Val,'v2':v2Val},
success:function (args){
$('#d3').val(args)} # 在d3中添加值为返回的计算结果
})
})
</script>
</body>
Content-Type
1.urlencoded
ajax默认的编码格式/form表单默认也是
数据格式 xxx=yyy&uuu=ooo
django后端会自动处理到requset.POST中
2.formdata
django后端针对普通的键值对还是处理到request.POST中，但是针对文件会处理到request.FILES中
3.application/ 发送json格式的数据
form表单不支持 ajax可以
<script>
$('#d1').click(function () {
$.ajax({
url:'',
type:'post',
data:JSON.stringify({'name':'jason','age':18}), // 千万不要骗人家
contentType:'application/json',
success:function (args) {
alert(args)
}
})
})
</script>
后端需要从request.body中获取并自己处理
ajax携带文件数据
视图层：
def index(request):
if request.method == 'POST':
print(request.POST) # <QueryDict: {'name': ['jason'], 'age': ['18']}>
print(request.FILES) # <MultiValueDict: {'file': [<InMemoryUploadedFile: 12.19之路由层最后一部分.md (application/octet-stream)>]}>
name = request.POST.get('name')
file = request.FILES.get('file')
return HttpResponse('123')
return render(request, 'index.html')
模板层:
<body>
<input type="text" id="d1">
<input type="file" id="d2">
<button id="d3">携带文件数据</button>
<script>
$('#d3').click(function () {
// 1.先产生一个fordata对象
let myForDataobj = new FormData();
// 2.该对象中添加普通数据
myForDataobj.append('name', 'jason')
myForDataobj.append('age', 18)
//3.往该对象中添加文件数据
myForDataobj.append('file', $('#d2')[0].files[0])
$.ajax({
url: '',
type: 'post',
data: myForDataobj,
// 2个固定的写法
contentType: false,
processData: false
})
})
</script>
</body>
标签：function,
get,
args,
request,
ajax,
Ajax,
POST
From： https://www.cnblogs.com/zhanghong1229/p/16993105.html