Question

我有一个包含多个选择字段的表单，允许您为每个选择选择多个条目。

每个选择都名为id1[]，id2[]，id3[]等。

使用Jquery尝试提交表单时，我可以检查是否有任何选项没有被选中？

我试过这个，但表格仍然提交。

$("#submit").click(function() {
        $("select[name^='id']:visible").each(function(index, element) {
            if ($(this).val() == "") return false; 
        });
});

我不需要知道哪个特定的'id'选择没有选择选项，但如果我这样做会很好..

由于

Answer 1

将代码附加到表单提交处理程序而不是提交按钮的点击处理程序，这样就可以阻止提交表单。

$("form").submit(function() {
    var rtn = true;
    $("select[name^='id']:visible").each(function(index, element) {
        if ($(this).val() == "") {
            console.log(this.id); // id
            rtn = false;
            return false;
        }
    });
    return rtn;
});

Answer 2

您可以使用filter功能返回未选择值的所有选择

var selectsWithNoValue = $("select[name^='id']:visible").filter(function() {
     return !this.value.length;
});

然后你可以检查长度，看看你是否有任何价值 - 你也可以访问这些元素

if(selectsWithNoValue.length) { // if there are selects with no value
    //do something
}

此外，由于您正在使用表单绑定到表单的提交处理程序而不是单击按钮。

因此，如果您想阻止表单提交，可以执行

return !selectsWithNoValue.length

如果有任何没有值的选择

，则返回false

FIDDLE

Jquery检查多个选择具有值集

2 个答案: