jquery - 提交后隐藏表格

Question

我正在使用这个表单插件

但是对于我的生活，我无法弄清楚在提交表单后如何进行大量的 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>

是的，我有不止一个“保存表单”实例

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 周围并隐藏它吗？似乎最简单的方法。