django中ajax向后台发送post请求-青柠博客

一：ajax请求图例：

二：views.py中的代码

def login_ajax_handle(request):
    """ajax登录处理"""
    # 获取用户名和密码
    u = request.POST.get("username")
    p = request.POST.get("password")
    # 进行校验
    if u == "smart" and p == "123":
        # 用户名和密码正确
        # ajx请求返回的就是json数据,不能返回页面或重定向
        return JsonResponse({"res": 1})
    else:
        # 用户名和密码错误
        return JsonResponse({"res": 0})

三：html中的代码

<!DOCTYPE html>
<html lang="en">
<head>
    {% load staticfiles %}
    <meta charset="UTF-8">
    <title>登录页面</title>
    <script src="https://cdn.staticfile.org/jquery/1.8.3/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
    <script>
        $(function () {
            $("#btnLogin").click(function () {
                // 获取用户名和密码
                var u = $("#username").val();
                var p = $("#password").val();
                // 此参数需要传递给后端,否则会csrf禁止,报403错误
                var csrf = $('input[name="csrfmiddlewaretoken"]').val();
                // 发起ajax请求
                $.ajax({
                    url: "/login_ajax_handle/",  // 请求的地址
                    type: "post",  // 请求方式
                    // 请求时传递过去的数据
                    data:{"username": u, "password": p, 'csrfmiddlewaretoken': csrf},
                    dataType: "json",  // 返回的数据格式
                    async: true,  // 异步的ajax
                }).success(function (data) {
                    if(data.res == 1){
                        // 请求成功实现页面跳转
                        window.location.href = "/index/";
                    }
                    else if(data.res == 0){
                        // 请求失败，显示错误信息
                        $("#errmsg").show();
                        $("#errmsg").html("用户名或密码错误");
                    }
 
                })
            })
        })
    </script>
    <style>
        #errmsg{
            display: none;
            color: red;
            font-size: 8px;
        }
    </style>
</head>
<body>
{# post请求必须加上下面这个变量 #}
{% csrf_token %}
<div>
    用户名: <input type="text" id="username"><br>
    密&nbsp;&nbsp;&nbsp;码: <input type="password" id="password"><br>
    <div id="errmsg"></div>
    <input type="button" id="btnLogin" value="登录">
</div>
</body>
</html>

版权声明 1 本网站名称：青柠博客
2 本站永久网址：https://www.qingningz.cn/
3 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长 QQ2362400196进行删除处理。
4 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。

THE END

django中ajax向后台发送post请求

一：ajax请求图例：

二：views.py中的代码

三：html中的代码

☀当前时间