javascript - 遍历多种类型的输入

Question

我正在尝试用 jQuery 编写一些表单验证。这是基本的，我只检查空输入。

但是，我的表单上存在三种不同类型的元素:<input type="text"> , <select>和 <input type="checkbox"> .我在使用所有这些进行验证时遇到了麻烦。

到目前为止，这是我的代码:

部分 HTML

<input type="hidden" name="required" value="title,first_name,family_name,job_title,company_name,country,address_1,town_city,post_code,telephone_2,email,subprimary_activity,subjob_title2,subscription" />

JavaScript

$("input[name=submit_form]").on("click", function(e) {
    e.preventDefault();
    var missing_items = [];
    var required_array = $("input[name=required]").val().split(",");
    var i;
    for (i = 0; i < required_array.length; i++) {
        var input_name = required_array[i];
        if ($("input[name=" + input_name + "]").val() == "" || $("select[name=" + input_name + "]").val() == "" || !$("input[name=" + input_name + "]").is(":checked")) {
            missing_items.push(input_name);
        }
    }
    alert(missing_items);
});

alert()当前通知我每个元素，无论它是否缺少值/检查。我知道这是为什么 - 这是因为我的 if具有三个参数，并且不能是 <input> 和一个<select> ，它将始终评估为真。

我如何重写它才能正常运行？有没有一种方法可以检查元素的输入类型，或者特定元素是否存在并因此只运行相关的验证？

例如

if (is input text) {
    check val() ! empty
}
else if (is select) {
    check val() !empty
}
else if (is input checkbox) {
    check :checked
}

Answer 1

在这里修改你的代码

if ($("input[name=" + input_name + "]").val() == "" || $("select[name=" + input_name + "]").val() == "" || !$("input[name=" + input_name + "]").is(":checked")) {
            missing_items.push(input_name);
        }

为此

var element = $("[name=" + input_name + "]");
if(element.is(":text"))
  // your code
else if (element.is("select")
  // your code
else if (element.is(":checkbox")
  // your code