<body> <h1>携带参数的AJax</h1> {% csrf_token %} <label for="num1"></label> <input type="text" id="num1"> + <label for="num2"></label> <input type="text" id="num2"> = <label for="result"></label> <input id="result" type="text"> <button class="cal">计算</button> </body>
<script> // 传参Ajax请求 $(".cal").click(function () { var num1 = $("#num1").val(); var num2 = $("#num2").val(); // 1.from表单无法传递json 只能通过ajax传递 json在django中至关重要 $.ajax({ url: "/cal/", type: "post", // 2.在传递json中 需要告知服务端你发送的请求,让它按照要求解析,否则无法获取到数值 contentType: "json", // 3.在传递参数的时候需要将变量序列化 data: JSON.stringify({ num1: num1, num2: num2, csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val() }), success: function (response) { console.log(response); $("#ret").val(response) } }) }); </script>
from django.shortcuts import HttpResponse def cal(request): # 1.这里request.body是将传递的json数据以字节的形式展现出来,因为服务器没有反序列化的工具,这里需要自己解开 print(request.body) # b'num1=12&num2=23' b'{"num1":"23","num2":"34"}' print(request.POST) # <QueryDict: {'num1': ['12'], 'num2': ['23']}> <QueryDict: {}> # 2.反序列化取出json传递的数据 import json json_dict = json.loads(request.body.decode("utf8")) print(json_dict["num1"]) return HttpResponse("OK")