Python Django-在ajax响应后重新加载模板

我是Django的新手，遇到了一个问题。我正在向django视图发送一个post请求，并将函数与HttpResponse一起返回，以便将模板的div内容更改为视图中传递的值。问题是：一旦ajax响应并更改了它的div值；页面立即重新加载。你们知道为什么吗

视图.py

def index(request):
if request.is_ajax():
    print("request is ajax")
    details = request.POST.get('id')
    return HttpResponse(details)
else:
    return HttpResponse("Failed)

base.html

<button id="checkres">Check result</button>
<form name="testform" id="testform" method="post">
    {% csrf_token %}
    <input type="text" id="rowfield">
    <input type="submit">
</form>

 $("#testform").submit(function (event){
    $row_num = $('#rowfield').val()
    $("#responseresult").text('checking');
    $.ajax({
        type: "POST",
        url: "/bot",
        data: {csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(), id: $row_num},
        success: function(data){
            $("#responseresult").text(data);
            alert(data);
        }
    });
});

检查结果
{%csrf_令牌%}
$（“#testform”）.submit（函数（事件）{
$row_num=$（'#rowfield'）.val（）
$（“#responseresult”）.text（“检查”）；
$.ajax({
类型：“POST”，
url:“/bot”，
数据：{csrfmiddlewaretoken:$（'input[name=csrfmiddlewaretoken]）.val（），id:$row_num}，
成功：功能（数据）{
$（“#responseresult”）。文本（数据）；
警报（数据）；
}
});
});

请尝试使用此选项查看您的视图

def index(request):
if request.is_ajax():
    print("request is ajax")
    details = request.POST.get('id')
    return JsonResponse(details, safe=False)
else:
    return JsonResponse("Failed" safe=False)

您还需要防止提交

 $("#testform").submit(function (event){
    $row_num = $('#rowfield').val()
    $("#responseresult").text('checking');
    $.ajax({
        type: "POST",
        url: "/bot",
        data: {csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(), id: $row_num},
        success: function(data){
            $("#responseresult").text(data);
            alert(data);
        }
    });
    event.preventDefault(); // prevents the page from refreshing.
});

---

您的javascript

submit

事件未调用

event.preventDefault（）

，这就是ajax响应后，事件正在刷新的原因。将javascript函数更改为：

 $("#testform").submit(function (event){
    $row_num = $('#rowfield').val()
    $("#responseresult").text('checking');
    $.ajax({
        type: "POST",
        url: "/bot",
        data: {csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(), id: $row_num},
        success: function(data){
            $("#responseresult").text(data);
            alert(data);
        }
    });
    event.preventDefault(); // prevents the page from refreshing.
});

$（“#testform”）.submit（函数（事件）{
$row_num=$（'#rowfield'）.val（）
$（“#responseresult”）.text（“检查”）；
$.ajax({
类型：“POST”，
url:“/bot”，
数据：{csrfmiddlewaretoken:$（'input[name=csrfmiddlewaretoken]）.val（），id:$row_num}，
成功：功能（数据）{
$（“#responseresult”）。文本（数据）；
警报（数据）；
}
});
event.preventDefault（）；//防止刷新页面。
});

---

进一步阅读关于

使用

JsonResponse

而不是

HttpResponse

的内容，请参见此-您正在提交表单上调用ajax。因此，您的ajax工作正常，但由于提交表单，它将重新加载页面。非常感谢，我已经为此苦苦挣扎了好几天：）感谢响应伙伴，如果您使用event.preventDefault（），HttpReponse也可以在不重新加载的情况下正常工作；哦，谢谢你也让我知道，我从来没有试过这么做。