如果多个选项值为空，如何显示警报

Question

我有以下 HTML 和 Javascript，但不起作用：

<select id="shirtinfo[0]" name="shirtinfo[0]">
    <option value="">Confederation</option>
    <option value="6770">Europe (UEFA)</option>
    <option value="16272">South America (CONMEBOL)</option>
    <option value="21684">Africa (CAF)</option>
    <option value="21771">North &amp; Central America (CONCACAF)</option>
    <option value="18091">Asia (AFC)</option>
    <option value="19193">Oceania (OFC)</option>
</select>
...
<select id="season" name="season">
    <option value="">Season</option>
    <option value="2013">2013</option>
    ...
</select>
...
<input id="submit" type="submit" value="[[Save:raw]]" onclick="validate()" />

<script>
function validate() {
    if  (document.querySelectorAll("#shirtinfo[0], #shirtinfo[1], #shirtinfo[2], #shirtinfo[3], #shirtinfo[4], #season, #style, #status").value)
        {
            alert("[[Please enter the mandatory fields]]");
            return false;
        }
}
</script>

所有第一个选项值都是空的，只有标题，如果未选择任何选项，则会显示警报。因此，用户需要从列表中至少选择一些不是第一个选项的东西。

我怎样才能做到这一点？

Answer 1

根据需要更改以下代码。只需循环访问适当的元素，如果 的select值为空，则根据需要进行中断和处理。

function validate() {
    "use strict";
    var selectEls = document.querySelectorAll('select'),
        numSelects = selectEls.length;

    for(var x=0;x<numSelects;x++) {
        if (selectEls[x].value === '') {
            alert('[[Please enter the mandatory fields]]');
            return false;
        }
    }

    // If the code execution reaches this point, all the tests pass
    // ...
}

可以改进代码，例如，如果您想继续循环所有元素并突出显示有问题的select元素，但这超出了本问题的范围。