Question

这是我的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。

Answer 1

使用ID“myDiv”更新div中的HTML：

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

修改

为了根据评论澄清我的回答，你应该做这样的事情来刷新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调用返回数据的方式调整代码，但这应该让您了解如何更新数据而不刷新整个页面。

Answer 2

target:        '.error_box_wrapper',

尝试使用id而不是class：

target:        '#error_box_wrapper',

Answer 3

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

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

3 个答案: