ajax

1、Urls.py

url(r'^index/', views.index),
url(r'^ajaxHandle/', views.ajaxHandle),

一、接下来应该给这个button按钮绑定一个事件了。用jQuery绑定事件
    1、引入jQuery
        （1）配置静态文件

2、Index.html：

<p>用户名<input type="text" class="user"></p>
<br>
<button>ajax</button>
<script>
    $(".user").blur(function () {
        var user=$(this).val();
        $.ajax({                            #语法
            url:"/ajaxHandle/",              #数据提交给谁
            type:"GET",                      #提交（请求）的方式
            data:{"username":user},          #向服务端发送数据（键值格式）
            success:function(data){    　　   #回调函数；发送一个请求给服务端之后如果服务端成功返回了一个数据，将要执行的代码。     #date这个参数代表的是服务器端发送过来的数据。
                data=JSON.parse(data);  　　　　#反序列化json字符串
                if (data["flag"]){
                    var $spans=$("<span>");    #创建一个span标签
                    $spans.text("用户已存在");  　　#给span标签添加内容
                    $("p").append($spans)            #span标签作为子标签，追加到p标签中。
                }
            }
        })
    });

 

3、Views.py

from app01.models import  *
# Create your views here.
import json
def index(request):
    return render(request,"index.html")
def ajaxHandle(request):
    if request.method=="POST":
        #HttpResponse.status_code=404  #老师一开始是这样写的可以试一试。代替下面两行
        obj=HttpResponse("OK")  　　　　#这一行和下一行都是在测试的时候用到。
        obj.status_code=404     　　    #作用：模拟遇到错误，发送状态码。
        #return HttpResponse("OK")
        return obj
    username=request.GET.get("username")
    #user=Use.objectes.filter(username=username)
    ret={"flag":False}
    if username=="Yuan":
        ret["flag"]=True
    return HttpResponse(json.dumps(ret))

 

 

 

jqXHR: jQuery增强的xhr。   xmlHttprequest.

其实python中有很多事情都是围绕一个事情在做，比如loging模块围绕着一个logger对象进行操作；model围绕着model对象在做。

Ajax围绕着一个对象来做，这个对象就是：xmlHttprequest，所有的信息都可以在这个里面去拿。比如错误信息，响应的内容等都在这个里面。

 

//=================== error============

这个函数是在整个流程中有报错时执行

                error: function (jqXHR, textStatus, err) {

                        // jqXHR: jQuery增强的xhr （XmlHttpRequest）

                        // textStatus: 请求完成状态  (要么是success要么是error)

                        // err: 底层通过throw抛出的异常对象，值与错误类型有关

                        console.log(arguments);

                    },

//=================== complete============

不管整个流程有没有出错，都一定要执行。

                complete: function (jqXHR, textStatus) {

                    // jqXHR: jQuery增强的xhr

                    // textStatus: 请求完成状态 success | error

                    console.log('statusCode: %d, statusText: %s', jqXHR.status, jqXHR.statusText);

                    console.log('textStatus: %s', textStatus);

                },

                //=================== statusCode============

                statusCode: {

                    '403': function (jqXHR, textStatus, err) {

                        console.log(arguments);  //注意：后端模拟errror方式：

HttpResponse.status_code=500   注意，这一条指令只是测试方法，在真实环境下只有真的遇到指定的状态码，才执行这里的代码

                     },

                    '400': function () {

                    }

                }

 

知识点回顾：

<script>

    alert(foo(1,2,43,5,777));

    function foo() {

        console.log(arguments);

    }

</script>