ajax异步请求，生成表格，局部刷新

通过点击form的查询按钮，请求后台数据，并生成表格添加到table中

先来一段简单的html的form和table：

<form onsubmit="return false" id="formAddtr" method="post">    <input type="text" name="id">    <button id="select1" onclick="subForm()">查询</button></form><table>    <thead>    <th>姓名</th>    <th>年龄</th>    <th>性别</th>    </thead>    <tbody id="test">    </tbody></table>

注意要写上onsubmit=”return false”，防止表单提交，因为ajax会提交，如果不写就重复提交了，会出现响应结果，但是闪一下又没了的情况

接下来是js代码ajax：

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script><script>//别忘了导入该用的js文件function subForm() {    $.ajax({        url: '/data/', //请求的url        type: 'post', //请求的方式        data: $('#formAddtr').serialize(), //form表单里要提交的内容，里面的input等写上name就会提交，这是序列化        error:function (data) {            alert('请求失败');        },        success:function (data) {            var str1 = "";            //清空table中的html            $("#test").html("");            for(var i = 0;i<data.data.length;i++){                str1 = "<tr>" +                     "<td>"+data.data[i].user_id + "</td>" +                    "<td>"+data.data[i].user_id + "</td>" +                    "<td>"+data.data[i].user_id + "</td>" +                    "</tr>";                $("#test").append(str1);            }        }    });}</script>

接下来是后台py文件，返回数据给前台

def data(request):    return JsonResponse({'data':{'name':'小明','age':10,'male':'男'}})