如何获取多选下拉框（multiple select）中的所有值？

嘿，我来帮你理清楚这个问题！首先先说明你当前代码的作用：你现在用的这段JQuery代码 var selectedValues = $('#multipleSelect').val(); 其实已经完美实现了获取选中选项的值——当用户选中多个选项时，它会直接返回一个包含所有选中值的数组（比如选了Text1和Text3，结果就是 ["1", "3"]），这是JQuery针对多选select的原生支持，不用额外处理~

如果你想要的是获取下拉框里所有选项的值（不管有没有被选中），那可以用下面这几种方法：

JQuery 实现方式 #

• 用map()遍历所有option元素，再转成普通数组：

// 获取所有选项的值（包含未选中的）
var allOptionValues = $('#multipleSelect option').map(function() {
    return $(this).val();
}).get();
// 最终结果：["1", "2", "3"]

这里的map()会逐个处理每个<option>，返回它们的value属性，最后用get()把JQuery对象转换成标准的JS数组。

原生JavaScript 实现方式（不用JQuery） #

如果不想依赖JQuery，也可以用原生JS来实现：

// 方式1：用Array.from + map
const selectEl = document.getElementById('multipleSelect');
const allOptionValues = Array.from(selectEl.options).map(option => option.value);

// 方式2：传统for循环
const selectEl = document.getElementById('multipleSelect');
const allOptionValues = [];
for (let i = 0; i < selectEl.options.length; i++) {
    allOptionValues.push(selectEl.options[i].value);
}

两种方式最终都会得到包含所有选项值的数组 ["1", "2", "3"]。

内容的提问来源于stack exchange，提问作者Mel