一.什麽是Ajax:

通過js語言跟後臺進行交互的一個東西
        -特點:異步,局部刷新
        -之前學了form表單提交,地址欄中輸入地址
        -js的語法:jquery的$.ajax()
       

二.怎麽用

  ajax往後臺提交數據
        $.ajax({
            url:‘請求的地址‘,
            type:‘get/post‘,
　　　　　　　contentType:application/json 指定前端傳到後端的編碼格式是json,數據在body裏　
 　　　　　　　datetype:‘json‘  指定後端傳到前端的數據格式是json,然後ajax轉成object字典
            data:{key:value,key2:value2},
            success:function(data){
                alert(data)
            }
        })
 

json格式傳送數據
前端
$(‘#btn2‘).click(function () {
       var user={name:$(‘#msg1‘).val(),pwd:$(‘#msg2‘).val()}
       console.log(user)
        $.ajax({
            url:‘/01test/‘,
            type:‘post‘,
            contentType:‘application/json‘,
            data:JSON.stringify(user),
            success:function (data) {
                if (data.status==100) {
                    location.href = data.url
                    console.log(data.status)
                }else{
                    console.log(data)
                    alert(‘賬號或密碼錯誤‘)
                }

            }
        })
    })
後端
 

import json
def test01(request):
    dic = {‘status‘: 100}
    user=json.loads(request.body.decode(‘utf-8‘))
    print(user)
    name=user.get(‘name‘)
    pwd=user.get(‘pwd‘)
    if name == ‘hui‘ and pwd == ‘123‘:
        dic[‘status‘] = 100
        dic[‘url‘] = ‘/book/‘
    else:
        dic[‘status‘] = 101
    print(dic)
    return JsonResponse(dic)

不帶json格式傳送數據

 前端
 $(‘#btn1‘).click(function () {
        var usr=$(‘#msg1‘).val();
        var pwd1=$(‘#msg2‘).val();
        $.ajax({
            url:‘/test/‘,
            type:‘post‘,
            data:{name:$(‘#msg1‘).val(),pwd:$(‘#msg2‘).val()},
            success:function (data) {
                if (data.status==100) {
                    location.href=data.url
                    console.log(data.status)
                }else{
                    console.log(data)
                    alert(‘賬號或密碼錯誤‘)
                }
            }
        })
    })
後端

def test(request):
 if request.method==‘GET‘:
     return render(request,‘test.html‘)
 else:
    print(request)
    dic={‘status‘:100}
    name=request.POST.get(‘name‘)
    pwd=request.POST.get(‘pwd‘)
    print(name,pwd)
    if name==‘hui‘ and pwd==‘123‘:
        dic[‘status‘]=100
        dic[‘url‘]=‘/book/‘
    else:
        dic[‘status‘]=101
    print(dic)
    return JsonResponse(dic)

django學習第85天Django的Ajax