如何使用 jquery ajax 整个表单

Posted 2023-03-05

【中文标题】如何使用 jquery ajax 整个表单

【英文标题】：How to ajax a whole form using jquery

【发布时间】：2012-01-30 14:13:56

【问题描述】：

我已经设置了一个 jquery 脚本来提交一个表单，我想获取响应（我相信这是一整页，虽然很小）并使用响应的内容来替换表单（因为响应只是表格）。

这是我的 jquery 脚本：

$("#addPersonButton").click(function()
    $.post("/MySite/MyAjaxServlet.do", $("#personForm").serialize(), function( data ) 
        var content = $( data );
        $( "#personForm" ).empty().append( content );
    );
);

但是我页面上的输出显示为“[object Object]”

如何将页面中的表单替换为响应中返回的表单？

【参考方案1】：

试试，

$( "#personForm" ).empty().append( data );

【参考方案2】：

html方法替换匹配选择器的内容

$( "#personForm" ).html( data );

【讨论】：

嗯。现在这个方法更快吗？

噢！ - 现在它的工作我失去了点击的绑定，即使在添加人员按钮上也是如此。

html 因为比同时使用 empty 和 append 快 2 倍，而且更清晰。演示：jsfiddle.net/nFfSx。您可以使用live 代替click - 这会将侦听器附加到当前元素上的事件，并且将来会存在

随着新的 jQuery 出现 on 和 off 方法，它们是 bind,live,unbind 和 die 的结果。在api.jquery.com/on

上阅读有关此内容的信息