在html

Question

[HTML]

现在我在下拉按钮中有三个选项：

 <select id='campus' class="form-control">
     <option value="Z010">Campus1</option>
     <option value="Z020">Campus2</option>
     <option value="Z040" selected>Campus3</option>
     <option value="?????">- All Campuses-</option>
 </select>

现在我想在下拉菜单中添加“All Campus”选项，其中包括所有校园的所有学生，我该怎么办？

我无法执行以下操作，因为我需要括号内的“AND”，而不是“OR”：

<option value="{'Z010', 'Z020', 'Z040'}">All</option>

有什么建议吗？

非常感谢!!

Answer 1

这是一种方法，使用<select multiple>和几行javascript：

var campusOptions = document.getElementsByTagName('option');
var allCampuses = document.querySelector('[value="all-campuses"]');

function selectAllCampuses() {
    if (allCampuses.selected === true) {
        for (var i = 0; i < (campusOptions.length - 1); i++) {
            campusOptions[i].selected = true;
            allCampuses.selected = false;
        }
    }
}

allCampuses.addEventListener('click', selectAllCampuses, false);

<select id="campus" class="form-control" multiple>
     <option value="Z010">Campus1</option>
     <option value="Z020">Campus2</option>
     <option value="Z040" selected>Campus3</option>
     <option value="all-campuses">- All Campuses -</option>
 </select>

Answer 2

我认为你应该输入你想要的任何东西，例如“z070”，然后以某种方式在javascript中使此选项添加所有以前的值...