Javascript 带有AJAX问题的jQuery提交表单

以下是我的jQuery代码：

<script type="text/javascript">
    //<!--
$(document).ready(function() {

    $('input[type="submit"]').click(function() {
        $.ajax({
              type: 'POST',
              url: $('form').attr('action'),
              success: function(data) {
                  //
              }
        });
        return false;
    });

});    //-->
</script>

//

单击“提交”按钮后，我想做的是：

• 向表单的action属性标识的页面发出AJAX请求（该属性恰好与表单的php脚本相同……因此表单基本上应该提交到同一页面）
• 用ajax请求返回值替换整个页面的HTML

然而，我不知道怎么做。表单的页面上没有html或body标记，因为表单正在使用jQuery添加到另一个页面中

那么，如何用HTML ajax返回替换页面的HTML呢

这就是整个HTML的样子（这是evrything，没有HTML或body标记）：

奥塔斯卡：
奥塔兹卡
奥德波维德：
（a）
奥德波
（b）
奥德波维德b
（c）
Odpoved c
//

替换整个页面的HTML 使用ajax请求返回的值

尝试如下修改

success

处理程序：

success: function(data) {
  $('form').after(data).end().remove();
}

<script type="text/javascript">
    //<!--
$(document).ready(function() {

    $('input[type="submit"]').click(function() {
        $.ajax({
              type: 'POST',
              url: $('form').attr('action'),
              success: function(data) {
                  $('body').html(data);
              }
        });
        return false;
    });

});    //-->
</script>

---

它使用

在当前表单之后插入ajax数据。after（data）

和

end（）

用于恢复到表单，最后

remove（）

用于删除表单

即使没有正文或html标记，您也应该可以这样替换它：

success: function(data) {
  $('form').after(data).end().remove();
}

<script type="text/javascript">
    //<!--
$(document).ready(function() {

    $('input[type="submit"]').click(function() {
        $.ajax({
              type: 'POST',
              url: $('form').attr('action'),
              success: function(data) {
                  $('body').html(data);
              }
        });
        return false;
    });

});    //-->
</script>

//

Firefox 3.6.8、IE 8和Chrome会自动插入html和body标记，如果它们不存在（这些是我测试过的）