清除表单后 Jquery 验证不起作用

Question

我已通过页面上的 JQuery 验证插件应用验证。验证工作正常，但是一旦按下Clear 按钮以清除表单上的所有字段，然后再次单击保存按钮，验证不会触发并且表单被提交。我在点击Clear 按钮时调用了以下javascript函数来清除所有表单字段：-

function ResetForm() {
            jQuery(':input', '#form1')
                .not(':button, :submit, :reset, :hidden')
                .val('')
                .removeAttr('checked')
                .removeAttr('selected');
            return false;
        }

Clear 按钮位于 ChildPage 上，ResetForm 功能位于 MasterPage 上。有人猜到为什么在清除字段后提交？

Answer 1

输入是一个元素，而不是属性或伪可选择，我在您的代码中看到的主要问题是:input 中的:

尝试更改为 jQuery('#form1 input') 以获取输入列表

同时更改not() 命令以选择按类型过滤输入

.not('[type="button"], [type="submit"], [type="reset"], [type="hidden"]')

对于:hidden，您应该了解几个因素。

• 它们的 CSS 显示值为 none。
• 它们是 type="hidden" 的表单元素。
• 它们的宽度和高度明确设置为 0。
• 祖先元素被隐藏，因此该元素不会显示在页面上。

---

根据您的评论，请尝试这个经过测试的版本：

function resetForm()
{
    $("#form1").find(':input').each(function()
    {
        var jelem = $(this);
        switch(this.type)
        {
            case 'password':
            case 'select-multiple':
            case 'select-one':
            case 'text':
            case 'textarea':
                jelem.val('');
                break;
            case 'checkbox':
            case 'radio':
                jelem.attr('checked',false);
        }
    });
}

@source：http://www.electrictoolbox.com/jquery-clear-form/

另一种方法是在表单中创建隐藏输入，但将类型设置为reset，如下所示：

<input type="reset" style="display:none" />

然后做：

function resetForm()
{
    $("#form1[type='reset']").click();
}

Answer 2

实际上错误是别的，RobertPitt 提供的代码对于清除表单域是正确的，我的代码对于清除表单域也是正确的。但问题是，在clear 按钮上，我应用了class="cancel"，因此表单不应被提交，因为它是aspx:button。

但是根据 JQuery 文档中所写的内容，单击类为 cancel 的按钮应该跳过验证，但之后如果我单击正常的 submit 按钮验证应该会触发，而我的案例。

我刚刚删除了 cancel 类，它起作用了。

Answer 3

这有帮助吗？

Reseting the form when usering the jquery validations plugin