0

我有触发 jQuery 验证的按钮。如果验证失败，按钮会淡出以帮助将注意力从按钮上转移到验证消息上。

$('#prev,#next').click(function (e)
{
    var qform = $('form');
    $.validator.unobtrusive.parse(qform);
    if (qform.valid())
    {
        // Do stuff then submit the form
    }
    else
    {
        $('#prev').fadeTo(500, 0.6);
        $('#next').fadeTo(500, 0.6);
    }

那部分工作正常。

但是，一旦清除了无效条件，我想取消淡化按钮。

是否可以连接到 jQuery Validation 以获取适当的事件（无需用户单击按钮）？如何？

更新

根据@Darin 的回答，我使用 jquery-validation 项目打开了以下票证

https://github.com/jzaefferer/jquery-validation/issues/459

4

2 回答 2

2

听起来你可能很奇怪，但 jQuery.validate 插件没有全局成功处理程序。它确实有一个成功处理程序，但这个处理程序是按字段调用的。查看以下线程，它允许您修改插件并添加此类处理程序。所以这是插件在修改后的样子：

numberOfInvalids: function () {
    /* 
    * Modification starts here...
    * Nirmal R Poudyal aka nicholasnet
    */
    if (this.objectLength(this.invalid) === 0) {
        if (this.validTrack === false) {
            if (this.settings.validHandler) {
                this.settings.validHandler();
            }
            this.validTrack = true;
        } else {
            this.validTrack = false;
        }
    }
    //End of modification 

    return this.objectLength(this.invalid);
},

现在在您的代码中订阅此事件很简单：

$(function () {
    $('form').data('validator').settings.validHandler = function () {
        // the form is valid => do your fade ins here
    };
});

顺便说一句，我看到您调用的$.validator.unobtrusive.parse(qform);方法可能会覆盖validator附加到表单的数据并杀死validHandler我们订阅的数据。在这种情况下，在调用 .parse 方法后，您可能还需要重新附加validHandler（我还没有测试过，但我觉得这可能是必要的）。

于 2012-07-04T20:00:27.987 回答
1

我遇到了类似的问题。如果您像我一样对更改源犹豫不决，另一种选择是挂钩到 jQuery.fn.addClass 方法。jQuery Validate 使用该方法在元素成功验证时将“有效”类添加到元素中。

(function () {
    var originalAddClass = jQuery.fn.addClass;
    jQuery.fn.addClass = function () {        
        var result = originalAddClass.apply(this, arguments);
        if (arguments[0] == "valid") {
            // Check if form is valid, and if it is fade in buttons.
            // this contains the element validated.
        }
        return result;
    };
})();

我找到了一个更好的解决方案，但我不确定它是否适用于您的场景，因为如果不显眼的变体提供相同的选项，我现在不知道。但这就是我最终使用标准变体的方式。

$("#form").validate({
    unhighlight: function (element) {
        // Check if form is valid, and if it is fade in buttons.
    }
});
于 2012-07-11T19:39:39.447 回答