0

我正在使用 jQuery 的表单插件异步提交表单。服务器通过设置 ajaxForm 调用的目标将 HTML 发送回 div #boardcontainer。这工作正常。

...
    var options = { 
      target:        '#boardcontainer',    // target element(s) to be updated with server response 
      beforeSubmit:  showRequest,  // pre-submit callback 
      success:       showResponse  // post-submit callback 
      };
    $('#myForm').ajaxForm(options); 
...

问题是，从服务器返回的 HTML 包含两个 div：

<div id="board">
...
</div>
<div id="status">
...
</div>

“#board”是一个由服务器预渲染的巨大 HTML 表格。“#status”是一条短消息，理想情况下应该进入#boardcontainer 以外的div。

处理这种情况的最佳方法是什么？jquery可以更改div的父级吗？如果是这样，我可以在提交后回调中更改父级，但我似乎找不到方法来做到这一点。

4

2 回答 2

3

在您的成功回调中，您可以使用 appendTo 重新排列 div。或者，您可以返回 json 并在成功回调中构建 div。

 $('#status').appendTo('#realTarget');

编辑：检查后，appendTo 本身会执行您需要它执行的操作，而不会丢失事件处理程序。

于 2009-02-21T13:04:38.260 回答
0

我最终用 json 构建了 div（不过，div 的 html 嵌入为字符串）

这是代码：

$(document).ready(function () {
    var options = {
        beforeSubmit: showRequest,  // pre-submit callback 
        success: showResponse,  // post-submit callback 
        dataType: 'json'
    };
    $('#myForm').ajaxForm(options);
});

function showResponse(data) {
    $('#statusTarget').html(data.status);
    $('#boardcontainer').html(data.board);
};

它可以工作，每次提交表单时，#statusTarget 和 #boardTarget 都会被新的 html 替换。

于 2009-02-21T17:32:36.413 回答