通过 jQuery 代码的单行/最少行验证所有输入字段

Question

我有一个表单，其中有 30 个输入框和 10 个文本区域和 3 个选择框（更新）字段，并且都是必填字段。

我如何通过 jQuery /javascript 对它can't be blank/empty/NULL. 的所有输入字段一起应用验证

我不想每次都使用每个输入框的 ID 并为每个输入框和文本区域创建单独的验证。

如果任何输入字段为空白，则其边框变为红色，并且当用户要编写某些内容时，则变为正常（无边框，即删除该类）

更新：

还有选择框..我如何一起验证它们？

Answer 1

类似这样的：

$("#myForm").submit(function() {

    // if there are some empty inputs
    if($(":input[value]").length != $(":input").length)) {

        // filter out the empty ones, apply some CSS
        $(":input").filter(function() {
            return this.value.length == 0;
        }).addClass("blank");

        // do not submit
        return false;
    }
});

$(":input").blur(function() {
    if(this.value.length > 0) {
        $(this).removeClass("blank");
    }
});

Answer 2

1. 从每个文本中删除红色边框， textarea 和列表框字段。
2. 过滤掉 至少包含 1 的元素 非空白字符 - \S+
3. 添加红色 其余元素的边框

javascript

function validate() {
  return $("input:text,textarea,select").removeClass('blank').filter(function() {
    return !/\S+/.test($(this).val());
  }).addClass('blank').size() == 0;
}

$('#form').submit(validate);

css

.blank {
    border: 1px red solid;
}