ajaxSubmit和response

我正在尝试处理ajaxSubmit事件，以便将表单替换为结果。该结果可能是确认页或表单上的错误。这个表单在它自己的页面上工作，所以我正在将它放在ajax模式中

<div id="biography">
    <form method="post" action="/{{ onesheet.url }}/contact/" id="contact-form" class="full">
        {% csrf_token %}
        <ul>
        {{ form.as_ul }}
        </ul>
        <input type="submit" value="Send Email">
    </form>
</div>

{%csrf_令牌%}

{{form.as_ul}}

还有js

<script type="text/javascript">
    $('#contact-form').submit(function() { 
        var options = { 
            target:        '#biography',   // target element(s) to be updated with server response 
            beforeSubmit:  showRequest,  // pre-submit callback 
            success:       showResponse  // post-submit callback 
        };
        // submit the form 
        $(this).ajaxSubmit(options);
        // return false to prevent normal browser submit and page navigation 
        return false; 
    });
</script>

$（'#联系方式'）。提交（函数（）{
变量选项={
目标：“#传记”，//要使用服务器响应更新的目标元素
beforeSubmit:showRequest，//预提交回调
成功：showResponse//post-submit回调
};
//提交表格
$（此）.ajaxSubmit（选项）；
//返回false以防止正常的浏览器提交和页面导航
返回false；
});

但这并不是在目标中加载响应。它将在整个页面中打开它

---

有什么想法吗？

您需要调用

e.preventDefault（）

，以防止正常提交：

<script type="text/javascript">
$('#contact-form').submit(function(e) { 
    e.preventDefault();
    var options = { 
        target:        '#biography',   // target element(s) to be updated with server response 
        beforeSubmit:  showRequest,  // pre-submit callback 
        success:       showResponse  // post-submit callback 
    };
    // submit the form 
    $(this).ajaxSubmit(options);
    // return false to prevent normal browser submit and page navigation 
    return false; 
});
</script>

$（“#联系表格”）。提交（职能（e）{
e、 预防默认值（）；
变量选项={
目标：“#传记”，//要使用服务器响应更新的目标元素
beforeSubmit:showRequest，//预提交回调
成功：showResponse//post-submit回调
};
//提交表格
$（此）.ajaxSubmit（选项）；
//返回false以防止正常的浏览器提交和页面导航
返回false；
});

我不完全理解提交时会发生什么。它是否转到“/{{onesheet.url}}/contact/”页？你想保持在同一页上吗？ajaxSubmit是否正常工作？能否为js函数“showRequest”和“showResponse”添加代码？