Question

我已经在我的页面上通过JQuery Validation Plugin应用了验证。验证工作正常，但是一旦点击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是一个元素，而不是属性或伪可选，我在代码中看到的主要问题是:

中的: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

清除表单后，Jquery验证无效

3 个答案: