ajax的get请求

最新推荐文章于 2024-02-23 11:46:43 发布

爱吃的胖猪�

最新推荐文章于 2024-02-23 11:46:43 发布

阅读量459

点赞数

本文链接：https://blog.csdn.net/weixin_43931159/article/details/84990952

版权

一、首先在views.py文件里定义如下函数：

def ajaxview1(request):
	return render(request,'ajaxget.html')
def ajaxview(request):
    list1=['小张','老李','老王']
    return JsonResponse({'usernames':list1})

注意：返回的JsonResponse里是字典，如果不是字典会报错

二、再配置路径urls.py文件，如下所示：

from .views import ajaxview,ajaxview1
urlpatterns = [
    url(r'ajaxshow',ajaxview),
    url(r'ajaxview',ajaxview1),
    ]

三、因为要用到jq，我们首先新建一个static文件夹，在static文件夹里新建一个js文件夹，将jquery-1.12.4.min.js添加到js文件夹下，如下所示：
在这里插入图片描述
然后在settings.py文件下添加static的路径，如下所示：

STATIC_URL = '/static/'
STATICFILES_DIRS=[os.path.join(BASE_DIR,'static')]

四、在templates文件夹下，新建一个ajaxget.html文件，写入如下代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>这是测试json</title>
    <script src="../static/js/jquery-1.12.4.min.js"></script>
    <script>
         $(document).ready(function () {
              $.ajax({
                        url:'/user/ajaxshow',
                        method:'GET',
                        contentType:'application/json',
                        dataType:'json',
                        success:function (data) {
                            alert(data.usernames);
                            var user_list   = data.usernames;
                            for (var i = 0; i < user_list.length; i++) {
                                $('#show').append('<li>' + user_list[i] + '</li>')
                            }
                        }
              })
        })
    </script>
</head>
<body>
这是测试ajax的页面
此处填写用户全部信息
<ul id="show">
    <li>小王</li>
</ul>
</body>
</html>

五、在浏览器输入地址http://127.0.0.1:8000/user/ajaxview，显示如下页面，弹框弹出的是获取到列表list1中的值：
在这里插入图片描述
点击确定后，就可以将列表list1的值添加到‘小王’后面了，如下所示：