Django -- Ajax模块

Ajax简介

        异步提交 局部刷新 --- Ajax的精髓

'向后端发送请求的几种方式

1  浏览器地址栏直接输入url回车，        GET请求
2  a标签href标签                       GET请求    
3  form表单                        GET/POST请求
4  ajax                              GET/POST请求

AJAX 不是新的编程语言，而是一种使用现有标准的新方法。(可以和装饰器比较)

AJAX 最大的优点，'在不重新加载网页内容的情况下，可以与服务器交换数据并更新部分网页内容'(这一特点给用户的感受就是在不知不觉中完成请求和响应过程。)

Django中的ajax依赖于jquery， 在前端页面使用ajax的时候，需要确保导入了jquery

'ps : 并不只有jQuery能够实现ajax，其他的框架也可以 但是换汤不换药 原理是一样的(可能关键字不一样，语法都一样)'

Ajax基本语法

小例子1：使用ajax实现下面需求

页面上有三个input框，
    在前两个框中输入数字， 点击按钮， 向后端发送ajax请求
    后端计算出来结果，再返回给前端动态展示到第三个框中
    整个过程页面不准刷新，也不能在前端计算

前端

<script>
    //先给按钮绑定一个点击事件
    $('#btn').click(function (){
        // 向后端发送ajax请求
        $.ajax({
            // 1. 指定向哪个后端发送ajax请求
            url:'',//不写就是朝当前地址提交
            // 2. 请求方式
            type:'post', // 不指定默认是get   get post 都是小写就可以
            // 3. 发送给后端的数据
            {#data:{'username':'jason','password':123},#}
            data:{'i1':$('#d1').val(),'i2':$('#d2').val()},
            // 4. 回调函数(异步回调机制) 当后端返回结果的时候会自动触发，args接受返回的结果
            success:function (args){
                {#alert(args)#}
                $('#d3').val(args) #通过DOM操作渲染到第三个input里面
            }
        })
    })
</script>

后端

 def ab_ajax(request):
    if request.method == 'POST':
        # print(request.POST)
        i1 = request.POST.get('i1')
        i2 = request.POST.get('i2')
        i3 = int(i1)+int(i2)
        return HttpResponse(i3)
    return render(request, 'index.html')
    # 无论返回什么都不是返回给前端页面，而是交给回调函数的args参数 

小例子2： 使用ajax实现下面需求

        给按钮绑定一个点击事件

       前端

 //给按钮绑定一个点击事件