Question

我正在使用此form plugin

但是对于我的生活，在提交表单后我无法弄清楚如何进行大量的DOM操作。

$('.save-form').each(function() {
    $(this).ajaxForm({
        beforeSubmit: function() {      
            //
        },
        success: function(data) {
            //
        }
    });
});

我已经尝试了$(this).find('div').hide();，但无济于事。

HTML：

<form method="post" class="save-form">
    <!-- inputs are here -->
    <div>I want to hide this as well as the parent, "save-form".</div>
</form>
<form method="post" class="save-form">
    <!-- inputs are here -->
    <div>I want to hide this as well as the parent, "save-form".</div>
</form>
<form method="post" class="save-form">
    <!-- inputs are here -->
    <div>I want to hide this as well as the parent, "save-form".</div>
</form>

是的，我有多个“save-form”实例

Answer 1

执行：

$('[class=save-form]').each(function() {
    $(this).ajaxForm({
        beforeSubmit: function() {      
            //
        },
        success: function(data) {
            $('[class=save-form]').hide();
        }
    });
});

请注意，它会隐藏包装集$('[class=save-form]')中的内容。您可能希望根据需要调整选择器。

顺便说一下，你可以使用：

$('.save-form')

而不是：

$('[class=save-form]')

Answer 2

如果在调用this之前存储对ajaxForm的引用，您可以在事件处理程序中使用它：

$('[class=save-form]').each(function() {
    var form = $(this);
    $(this).ajaxForm({
        beforeSubmit: function() {      
            //
        },
        success: function(data) {
            form.hide();
        }
    });
});

Answer 3

每个接受两个参数。使用它们。

$('[class=save-form]').each(function(index, form) {
    $(this).ajaxForm({
        beforeSubmit: function() {      
            //
        },
        success: function(data) {
            $(form).find('div').hide();
        }
    });
});

Answer 4

不确定这是否是答案，但你可以将它包裹在一个div并隐藏它吗？似乎最简单的方法。

提交后隐藏表单

4 个答案: