Question

我有一个自定义样式选择，我需要将错误类附加到其包装器上，所以我这样做：

$('form').validate({
    ignore: [],
    errorPlacement: function(error, element) {
        if (element.attr('name') === 'state') {
            error.insertAfter('.select-wrap');
        } else {
            error.insertAfter(element);
        }
    },
    highlight: function(element) {
        if (element.type === 'select') {
            $(element).parent('.select-wrap').addClass('error');
        } else {
            $(element).addClass('error');
        }
    },
    unhighlight: function(element) {
        if (element.type === 'select') {
            $(element).parent('.select-wrap').removeClass('error');
        } else {
            $(element).removeClass('error');
        }
    }
});

这会在正确的位置获取我的错误标签，但它仍然将错误类添加到select元素，而不是其父元素。

如果我将if (element.type === 'select')更改为if (element.attr('name') === 'select')以获取突出显示/取消突出显示功能，则验证无法启动。：

Answer 1

问题似乎在于，当您说element.type它正在返回select-one时，您的比较element.type === 'select'就会失败。

相反，您可以使用element.tagName === 'SELECT'或$(element).is('select')

$('form').validate({
    ignore: [],
    errorPlacement: function (error, element) {
        if (element.attr('name') === 'state') {
            error.insertAfter('.select-wrap');
            error.removeClass('error')
        } else {
            error.insertAfter(element);
        }
    },
    highlight: function (element) {
        console.log(element, element.type, element.tagName)
        if ($(element).is('select')) {
            $(element).parent('.select-wrap').addClass('error');
        } else {
            $(element).addClass('error');
        }
    },
    unhighlight: function (element) {
        if ($(element).is('select')) {
            $(element).parent('.select-wrap').removeClass('error');
        } else {
            $(element).removeClass('error');
        }
    }
});

演示：Fiddle

HTMLSelectElement.type

HTMLSelectElement.type只读属性返回表单   控制的类型。可能的值是：


＆＃34;选择数倍＆＃34;如果可以选择多个值。

＆＃34;选择酮＆＃34;如果只能选择一个值。

jQuery Validate - 有条件地突出显示输入父级

1 个答案: