Javascript 提交时将错误css应用于所有空输入

我正在尝试使用下面的代码段将

边框底部

应用于单击事件时为空的所有输入

var formElements = [];
    $("form :input").each(function(){
        formElements.push($(this));
    });

    if (formElements[1][0].value == '') {
        $("#username").css('border-bottom', '2px solid red').focus();
        return false;
    }
    if (formElements[0][0].value == '') {
        $("#id").css('border-bottom', '2px solid red');
        return false;
    }

jQuery仅将CSS应用于最后一个元素，如何在不使用多个语句的情况下将CSS应用于所有div。

只需尝试一下

var hasFocus = false; 
$( "form :input" ).each( function(){
    var $this = $( this );
    if ( $this.val().length == 0 )
    {
       $this.css( 'border-bottom', '2px solid red' );
    }
    if ( !hasFocus )
    {
       $this.focus(); 
       hasFocus = true; //set to true so that next erroneous input doesn't get focussed
    }
});

---

你的方式似乎很复杂。似乎最简单的解决方案是循环输入、检查值和添加类

var inputs=$（“表单：输入”）.removeClass（“错误”）
inputs.filter（（i，e）=>！e.value.length）.addClass（“错误”）；
//filter（函数（i，e）{return！e.value.length；}）.addClass（“error”）
。错误{
底部边框：2倍纯红；
}

挑选
测试
挑选
试验
请将您的html代码与问题一起发布，为什么要逐一发布？谢谢。如果我需要使用您的代码阻止表单提交，我可以怎么做？
var errors=inputs.filter（…）.addClass（…）；返回错误。长度===0