Question

我在此网站上发现了一种在不离开页面的情况下提交POST表单的方法。在该脚本中，他们提供了有关如何在提交表单后进行功能的说明。这是脚本的样子：

$(document).ready(function(){
$form = $('form');
$form.submit(function(){
  $.post($(this).attr('action'), $(this).serialize(), function(response){
  },'json');
  return false;
});
});

他们说，在function(response){和},'json');之间，您可以在提交表单后指定其他JavaScript，例如提醒等。我试过了

$(document).ready(function(){
$form = $('form');
$form.submit(function(){
  $.post($(this).attr('action'), $(this).serialize(), function(response){
$('form').hide();
  },'json');
  return false;
});
});

不幸的是，这不起作用，任何人都可以告诉我为什么？我已经设置了jsFiddle。请帮忙。感谢。

Answer 1

使用$ .post，“函数（响应）”仅在成功结果后调用，因此在服务器处理请求时，您在此功能中的工作时被误导。

要在将请求发送到服务器后继续处理，请在$ .post调用后放置$（'form'）。hide（）：

$form.submit(function(){
  $.post(
    $(this).attr('action'), $(this).serialize(), 
    function(response){
    }
    ,'json'
  );
  $('form').hide();
  return false;
});

Answer 2

问题：

将JavaScript变量设置为form，而不是$form。然后在jQuery中将其用作$(form)。
$(this).attr('action')的上下文是$.post()回调，不是表单。解决方案：$(form)代替$(this)。

解决方案：

$(document).ready(function(){
    form = $('form');

    $(form).on('submit', function() {
        $.post($(form).attr('action'), $(this).serialize(), function(response) {
            $('form').hide();
        },'json');

        return false;
    });
});

Answer 3

当表单更改为

时，您的小提琴工作正常

<form action="#" method="post">

http://api.jquery.com/jQuery.post/上的文档显示这是一种有效的语法，http://www.johnnycode.com/blog/2010/04/08/jquery-form-serialize-doesnt-post-submit-and-button-values-duh/也是一个正在运行的示例。如果它根本不适合您，那么就像这样愚蠢，你在页面中引用了jQuery吗？

在提交表单后执行脚本

3 个答案: