Question

我正在尝试使用jQuery验证来突出显示我的单选按钮的标签，而不是我的其他输入的标签。我的单选按钮设置有一个名为'type'的标签。我似乎无法让它发挥作用！

$(document).ready(function(){
    $("#healthForm").validate({

 highlight: function(element, errorClass) {
     $(element).addClass(errorClass)
     $(element.form).find("label[for='type']")
                    .addClass("radioerror");
  },
  unhighlight: function(element, errorClass) {
     $(element).removeClass(errorClass)
     $(element.form).find("label[for='type']")
                    .removeClass("radioerror");
  },
    errorPlacement: function(error, element) {
        }
    });
  });

Answer 1

我对jQuery的验证插件并不熟悉，但这个似乎不对：

$(element.form).find("label[for='type']")

首先，我认为$(element.form)应该是$(element).closest('form')？我错了：P

其次，.find("label[for='type']")与“element”无关，因为同一表单中的任何其他元素都会获取相同的标签。

如果标签是单选按钮的兄弟，则可能需要直接使用sibling()。

Answer 2

我将您的代码更改为以下内容然后才有效！

$(document).ready(function(){
    $("#healthForm").validate({
        highlight: function(element, errorClass) {

            if(element.type == 'radio') {
                $(element.form).find('[name="' + element.name + '"').each(function(){
                    var $this = $(this);
                    $this.closest('label[for="' + $this.attr('id') + '"').addClass(errorClass);
                });
            }

        },
        unhighlight: function(element, errorClass) {

            if(element.type == 'radio') {
                $(element.form).find('[name="' + element.name + '"').each(function(){
                    var $this = $(this);
                    $this.closest('label[for="' + $this.attr('id') + '"').removeClass(errorClass);
                });
            }

        },
        errorPlacement: function(error, element) {
        }
    });
});

jQuery验证 - 突出显示无线电标签

2 个答案: