基于django的异步请求总结

ajax简介
通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。Ajax 在浏览器与 Web 服务器之间使用异步数据传输（HTTP 请求），这样就可使网页从服务器请求少量的信息，而不是整个页面。

ajax应用
在有些情况下我们既需要与服务器进行数据交互，但是又不能刷新网页，比如项目中在用户注册时验证用户的邮箱或者手机号是否已经注册，以及用户在输入用户名时验证改用户名是否已被占用。

ajax基础语法
我们的ajax代码是写在jq里的，所以首先要注意入口函数一定要写对（首先你还得有jq）

<script src = "jquery-3.0.0.js"></script>
<script>
	$(
		function(){
			内容
		}
	)
</script>

一个简单的ajax代码如下

<script src = "jquery-3.0.0.js"></script>
<script>
    $(
        function () {
            $("#button").click(
                function () {
                    $.ajax(
                        {
                            url: "",//请求的地址
                            type: "",//请求的方式，get或者post
                            data: "",//请求的数据
                            success:function (data) {
                                //data 后台返回的数据
                            },//请求成功后执行的函数
                            error:function (error) {
                                //error 后台返回的错误数据
                            }//请求失败后执行的函数
                        }
                    )//创建ajax对象
                }
            )
        }
    )
</script>

案例
这里有一个简单的注册案例：用户只需要输入用户名和密码便可以完成注册，我们需要在用户输入用户名后验证改用户名是否已经存在，如果用户名已经存在则告知用户“”该用户名已存在，不允许注册”，如果用户名不存在则允许注册。

首先写一个简单的注册页面用于用户注册

在视图文件中定义（需要先建用于存储用户名和密码的数据库，这里不做过多描述）

在路由中指出

效果如下

当用户输入用户名后，我们要判断用户输入的用户名是否已经存在，这里就要用到ajax了

首先在视图文件中定义一个用于判断用户名是否存在的函数

在路由中指出

接下来在注册页面的HTML文件中使用ajax调用用户名判断函数进行判断
接下来启动项目，验证功能是否可以实现

首先我们先创建一个用户名和密码均为admin的用户
可以看到该用户的信息已保存到数据库中

当我们再在注册页的用户名输入框输入用户名admin时，用户名输入框鼠标离焦后效果如下
用户点击确定后用户名输入框内的值将被清空，让用户重新输入