jQuery的验证onfocusout不适用于复选框和单选 [英] jquery validator onfocusout not working for checkbox and radio

问题描述

使用jquery验证程序.使用Tab浏览表单时不会执行验证.

Using jquery validator. validation is not performed when using tab to navigate the form.

这是小提琴

$(function () {
         var validator = $("#myForm").validate({ 
             onfocusout: function(element) {
                   this.element(element);
                },
             rules: { 
                 fname: "required", 
                 check: "required",
                 color: "required"
                }, 
             messages: { 
                 fname: "Enter your firstname", 
                 check: "you know you do",
                 color: "pick one!",
             }, 
         }); 
     });

我尝试对复选框执行模糊处理.但是，该事件是在窗体加载时触发的. 这是改进的小提琴

I tried to perform a on blur on the checkbox. However, the event is trigger on form load. Here's the improved fiddle

$('#check').on('blur', function() {
            $("#myForm").validate().element( this );
        }).blur();

推荐答案

onfocusout问题的解决方案/解决方案是对复选框和单选按钮使用on模糊.

The solution/work around the onfocusout issue is to use the on blur for both checkbox and radio.

$(function () {
    var validator = $("#myForm").validate({ 
        onfocusout: function(element) {
            this.element(element);
    },
    rules: { 
        fname: "required", 
        check: "required",
        radio: "required",
        color: "required"
    }, 
    messages: { 
        fname: "Enter your firstname", 
        check: "check your checkbox",
        radio: "check your radio",
        color: "pick one!",
    }, 
    }); 

    $('#check').on('blur', function() {
        $("#myForm").validate().element( this );
    });
    $('#radio').on('blur', function() {
        $("#myForm").validate().element( this );
    });
});

请注意，您不会像这样调用模糊函数:

Take note that you do not call the blur function like this:

$('#check').on('blur', function() {
    $("#myForm").validate().element( this );
}).blur();

初始模糊功能将导致验证在加载时触发

the initial blur function will cause the validation to be trigger on load

这是工作的小提琴

这篇关于jQuery的验证onfocusout不适用于复选框和单选的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！