表单提交后刷新div不起作用答案

【问题标题】：Refresh div after form submit not working表单提交后刷新div不起作用
【发布时间】：2011-11-15 21:41:40
【问题描述】：

这是我的 Javascript：

<script type="text/javascript"> 
// prepare the form when the DOM is ready 
$(document).ready(function() { 
    var options = { 
        target:        '.error_box_wrapper',   // target element(s) to be updated with server response 
        beforeSubmit:  showRequest,  // pre-submit callback 
        success:       showResponse,  // post-submit callback 
    }; 
    // bind form using 'ajaxForm' 
    $('#edit_group_form').ajaxForm(options); 
}); 
// pre-submit callback 
function showRequest(formData, jqForm, options) { 
    return true; 
}  
// post-submit callback 
function showResponse(responseText, statusText, xhr, $form)  {  
    alert("Success!");
} 
</script>

我正在使用Jquery表单插件，提交表单后，我想刷新页面上的div。

【问题讨论】：

这里没有可以更新任何 div 的代码。 showResponse 仅执行警报。
有什么事吗？你收到警报了吗？
是的，我收到警报，不知道在哪里放置刷新 div 代码，我尝试在警报之前放置但没有成功。
这是我使用的代码片段：
$('#middle').load( $(this).attr('href') + ' #middle' );

标签： php jquery ajax forms

【解决方案1】：

使用 ID 'myDiv' 更新 div 中的 HTML：

function showResponse(responseText, statusText, xhr, $form)  {  
    alert("Success!");
    $('#myDiv').html('YAY!');
}

编辑

为了澄清我基于cmets的响应，你应该做这样的事情来刷新div中的数据：

var $newData = $(document.createElement('div'))
.append(
    $(document.createElement('div'))
        .append("First Name: "+results.User.first_name)
)
.append(
    $(document.createElement('div'))
        .append("Last Name: "+results.User.last_name)
);

$('#DivName').html($newData);

这将创建一个新的 HTML 元素，其中包含基于虚假结果对象的数据。您必须根据从 ajax 调用返回数据的方式来调整代码，但这应该让您了解如何在不刷新整个页面的情况下更新数据。

【讨论】：

那只是用“耶！”填充我的 div，我想用新内容刷新 mydiv。
耶是新内容。改变“耶！”到您要在完成后提供的内容。您可以添加任何 HTML 字符串、大多数 jQuery 对象或 javascript 变量字符串。
我想你需要澄清一下“用新内容刷新”是什么意思。
刷新 div 即可。提交表单后，我想刷新一个 DIV。
用什么刷新？你还没说你想放什么？更改列出的 html 是“刷新” div，只要取出旧内容并放入新内容。你想完成什么？

【解决方案2】：

target:        '.error_box_wrapper',

尝试使用 id 而不是类：

target:        '#error_box_wrapper',

【讨论】：

这部分工作正常，我想刷新一个div。
那么你的 div 提交后有新内容了吗？

【解决方案3】：

function showResponse(responseText, statusText, xhr, $form)  {  
    alert("Success!");
    $('#divID').innerHTML('new content');
}

【讨论】：