用ajax实现简单的局部刷新技术:求乘法
稍微简单的ajax依赖于jQuery 所以首先要导入jQuery包,在写ajax 代码块
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 ????<meta charset="UTF-8"> 5 ????<meta name="viewport" content="width=device-width, initial-scale=1"> 6 ????<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"> 7 ????<title>首页</title> 8 </head> 9 <body>10 <h4>这是home页面</h4>11 <input type="text" id="s1">+12 <input type="text" id="s2">=13 <input type="text" id="s">14 <button type="button" id="b1">提交</button>15 <script src="/static/jquery-3.3.1.min.js"></script>16 <script src="/static/bootstrap/js/bootstrap.min.js"></script>17 <script>18 ????$("#b1").on("click",function () {19 ????????$.ajax({20 ????????????url:"/ajax_do/", ???????????????????#对应去执行哪个视图操作21 ????????????type:"GET", ????????????????????????#以哪种方式请求22 ????????????data:{"s1":$("#s1").val(),"s2":$("#s2").val()}, ?#要传送过去的数据23 ????????????success:function (data) { ???????????# data是后台返回的结果24 ????????????????$("#s").val(data); ??????????????#将结果指定给文本框的值25 ????????????}26 ????????})27 ????})28 </script>29 </body>30 </html>
后端对应的方法操作:
1 from django.views.decorators.csrf import csrf_exempt 2 @csrf_exempt 3 def home(request): 4 ????return render(request,‘home.html‘) 5 @csrf_exempt 6 def ajax_do(request): 7 ????s1=int(request.GET.get(‘s1‘)) 8 ????s2=int(request.GET.get(‘s2‘)) 9 ????print(s1,s2)10 ????s=s1*s2 ?#后台得到的两个数据进行处理11 ????return HttpResponse(s) ??#结果返回
AJAX局部刷新和异步技术
原文地址:https://www.cnblogs.com/wen-kang/p/9618385.html