Javascript 仅验证表单中的可见元素

我想在步骤表单中单击next按钮验证表单元素。我正在使用下面的代码来验证所有隐藏的字段。我需要帮助。提前谢谢

这是我的密码：

$('.msf-form .btn-next').on('click', function() {                                 
    var parent_fieldset = $(this).parents('fieldset');
    var next_step = true;


    parent_fieldset.find('.is_required').each(function() {
        if( $(this).val() == "" ) {
            $(this).focus().css('border','1px solid #F44336');
            $(".error-messages-slct").text("Please Select an option in the list").fadeIn();
            next_step = false;
        }
        else{
       $(this).focus().css('border','0px solid #F44336');
       $(".error-messages-slct").empty().fadeOut();

    }
    });

    parent_fieldset.find('.is_required1').each(function() {
        if( $(this).val() == "" ) {
            $(this).focus().css('border','1px solid #F44336');
            $(".error-messages-slct1").text("Select an option in the list").fadeIn();
            next_step = false;
        }
        else{
       $(this).focus().css('border','0px solid #F44336');
       $(".error-messages-slct1").empty().fadeOut();

    }
    });

    if( next_step ) {
        parent_fieldset.fadeOut(400, function() {
            $(this).next().fadeIn();
        });
    }

});

---

您可以在选择器之后添加

：可见的
。使用此引用

您只需对当前可见的元素进行检查，而不必检查类“.is_required1”和“.is_required”的每个元素。您可以为此使用其他类，也可以查询display属性

考虑到minksmnm的建议，您可以使用
find（'.is_required:visible'）
而不是“find（'.is_required'）”，来仅选择可见元素。在其他范围内，您的查找也会获取隐藏的元素并对其进行验证。
可见元素是在选择不同单选按钮之后出现的元素。在每个不同的收音机上都有不同的选择框，它在不同的收音机按钮下验证所有选择框漂亮的一个，没有想到这一点。旁白：这在功能上与显示属性不同吗？（我想我记得可见性：隐藏和显示：没有区别）@SREagle这里你可以看到区别：-）非常感谢你的例子，这证实了我半遗忘的“知识”。但是我刚刚发现jQuery的.fadeIn/.fadeOut也设置了display属性，所以它与OP的问题无关。