【问题标题】:How to fire jQuery function only if form is valid仅当表单有效时如何触发 jQuery 函数
【发布时间】:2011-02-19 17:24:45
【问题描述】:

我有一个与我的提交按钮相关联的 jQuery 函数,如下所示:

$(function () {
    $('#signupform').submit(function () {
        alert('test');
    });
});

但是,无论表单是否有效,它都会触发。我的模型装饰有各种 DataAnnotations 并且客户端验证运行良好,但我只希望 jQuery 函数在表单经过验证时触发。我该如何做到这一点?

编辑:为了澄清,我使用 MVC DataAnnotations + jQuery 的不显眼的 javascript 来处理客户端验证。我没有编写自己的 javascript 验证例程。内置的 jQuery 验证在验证表单方面做得很好,但我只需要知道如何在我自己的函数中将该验证的结果转换为布尔值。

【问题讨论】:

    标签: javascript jquery boolean unobtrusive-validation


    【解决方案1】:

    如果您使用 jquery validate 不显眼的验证,您可以:

    $(function () {
        $('#signupform').submit(function () {
            if($(this).valid()) {
                alert('the form is valid');
            }
        });
    });
    

    【讨论】:

    • 为了避免表单提交两次添加event.preventDefault();检查thisthis,希望对一些人有所帮助。
    • 当我包含"~/Scripts/jQueryValidator1.11/jquery.validate.js"时怎么没有定义valid()
    • @shaijut,我知道这是一条旧评论,但请注意您引用的示例正在处理按钮单击事件。当您使用表单提交事件时,我认为双重提交不是问题
    【解决方案2】:
    $(function () {
        $('#signupform').submit(function (e) {
            if (validateForm() === true) {
                alert('Form is valid.');
            }
        });
    });
    

    请注意,validateForm() 函数将是您在浏览器中用于测试验证的函数。编辑:这确实是 jQuery 的$(this).valid()

    注意:在澄清问题时,上面的答案是在验证时停止提交表单的一种方法,但不是所需的技术 (jQuery valid() validation)。有关详细信息,请参阅 Darin Dimitrov 的回答。

    此外,在重读原始问题时,其意图与我最初描述的完全相反。因此,我进行了编辑以演示验证的功能响应,而不是如何防止提交表单。

    【讨论】:

      猜你喜欢
      • 2018-03-22
      • 2011-11-02
      • 2013-05-20
      • 2013-07-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-01-04
      • 2014-04-24
      相关资源
      最近更新 更多