Javascript 仅在提交时重新加载此表单或div

我的代码运行良好。它提交数据而不重新加载

但我只想在提交时像往常一样重新加载此表单或此div

简言之，我想像使用type=“submit”一样提交此表单。我不想再阻止js加载了，但是只加载这个表单，而不是其他div或整个页面

我应该在这里写什么

.done(function(data){
//reload div or form only         
}) 

我


提交
$（文档）.ready（函数（）{
//使用$.ajax（）方法提交表单
$（'答复'）。提交（功能（e）{
e、 preventDefault（）；//防止默认提交
$.ajax({
url:'reply.php？slug='，
键入：“POST”，
数据：新表单数据（本），
contentType:false，
cache:false，
processData:false，
})
.完成（功能（数据）{
//这里我只想刷新表单或div，就像通常在提交时一样
})
.fail（函数（）{
警报（'Ajax提交失败…'）；
});
});
});

您试过iframe吗？ 为表单创建单独的页面，并使用iframe将其加载到主页面上

更多信息请访问

更换零件很容易：

$('#reply').html(data);

假设服务器返回相同的HTML标记

然而，事件绑定可能还有另一个问题——绑定到被替换元素的所有事件都将消失。因此，您有两种选择：

将内容提取到函数中

这是相当不言自明的：将所有内容提取到一个单独的函数中，这样您就可以递归地调用它。所以移动这部分：

$('#reply').submit(function(e){
    e.preventDefault(); //
    // [...]
});

分为一个单独的块：

function bindMyAwesomeSubmit() {
    $('#reply').off('submit.mynamespace').on('submit.mynamespace', function(e){
        e.preventDefault(); //
        // [...]
        $.ajax()
        .done(function(data){
            $('#reply').html(data);
            bindMyAwesomeSubmit();
        });
    });
}
$(document).ready(bindMyAwesomeSubmit);

（我们还负责解除绑定事件以防止内存泄漏）

使用事件委派

另一个选项是使用，这意味着您实际上将事件绑定到更高的元素，而不是表单

这基本上意味着，您将使用不同的方式来代替

$（'form'）.submit（）

：

$('body').on('submit', 'my-form', callback)

---

（

body

用作示例，只需使用未更改的最近父项。

通常

iframe

不用于表单。