Twitter bootstrap 3 使用引导选项卡进行jQuery验证

我有一个表单，有多个引导选项卡，里面有多个输入和选择字段，有些是必需的，有些不是

我正在使用jQuery验证插件来验证表单。下面是使用工作正常的引导css高亮显示和取消高亮显示错误：

    highlight: function(element) {
        $(element).closest('.input-group').addClass('has-error');
    },
    unhighlight: function(element) {
        $(element).closest('.input-group').removeClass('has-error');
    },

我真正需要的是，如果任何选项卡未验证字段，我也希望该选项卡高亮显示

我使用了下面的代码，但有趣的是代码有时有效，并用红色突出显示选项卡，有时不起作用

if($(".tab-content").find("div.tab-pane:has(div.has-error)").length != 0){
    $(".tab-content").find("div.tab-pane:has(div.has-error)").each(function(index, tab){
        var id = $(tab).attr("id");

        $('a[href="#' + id + '"]').tab('show').addClass('bg-danger');
    });
} else {
    $(".nav-tabs li a").each(function(){
        if($(this).hasClass('bg-danger')){
            $(this).removeClass('bg-danger');
        }
    });
}

我做错了什么？如果有任何必填字段出现错误，我如何突出显示选项卡