1

我正在使用 jQuery/Ajax 脚本提交表单而不重新加载页面。我在页面上有多个表单，它们都有相同的类（并且没有 id）。这可以很好地使用以下方式提交表单：

    $('document').ready(function()
{
    $('.form').ajaxForm( {
        success: function() {
            //$('.form').addClass("clicked");
            //$(this).slideUp('fast');
        }
    });
});

但是一旦我想在提交成功后做某事，似乎就没有办法引用提交的表单。使用 this 运算符是有意义的，但它不起作用。我想做这样的事情：

$(this).slideUp('fast');

根据提交的表单分别为每个元素。（使用 .form 作为选择器不起作用，因为它隐藏了所有表单）。

我尝试向表单添加一个类（尽管似乎也无法引用正确的元素），然后用于调用 slideUp 函数。

谢谢

4

2 回答 2

2

您使用的 ajaxForm 插件在成功回调中提供了对表单的引用：

success: function (responseText, statusText, xhr, $form) {
    $form.slideUp("fast");
}

文档：http: //jquery.malsup.com/form/#ajaxForm

如果您没有使用此插件，则必须自己维护该引用。this一种流行的方法是通过将其分配给以下内容来保留对适当的引用self：

$(".form").on("submit", function () {
    var self = this;
    $.ajax({
        success: function () {
            $(self).slideUp();
        }
    });
});
于 2012-11-18T06:21:32.927 回答
1

该插件为您提供了另一种方法 - ajaxSubmit()- 可以按如下方式使用：

$('.form').submit(function() { 
    var $form = $(this);
    $form.ajaxSubmit({
        success: function() {
            $form.addClass("clicked").slideUp('fast');//or whatever
        }
    });     
    return false; //suppress natural form submission
});
于 2012-11-18T06:56:06.420 回答