javascript下拉列表多选
时间: 2023-11-25 11:47:57 浏览: 106
js多选下拉列表
5星 · 资源好评率100%
JavaScript下拉列表可以通过设置multiple属性来实现多选功能。当设置了multiple属性后,下拉列表会变成一个可多选的列表框,用户可以通过按住Ctrl键来选择多个选项。在JavaScript中,可以通过获取下拉列表的options属性来获取所有选项,然后遍历选项来判断哪些选项被选中了。下面是一个示例代码:
```
<select id="mySelect" multiple>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
<option value="4">选项4</option>
</select>
<script>
var select = document.getElementById("mySelect");
var selectedValues = [];
for (var i = 0; i < select.options.length; i++) {
if (select.options[i].selected) {
selectedValues.push(select.options[i].value);
}
}
console.log(selectedValues);
</script>
```
在上面的代码中,我们首先获取了id为mySelect的下拉列表,然后遍历了所有选项,判断哪些选项被选中了,并将它们的值存储在selectedValues数组中。最后,我们通过console.log输出了选中的值。
阅读全文