jquery获取页面中多个 select 组件选中的值
时间: 2023-09-30 11:10:38 浏览: 199
可以使用 jQuery 中的 `val()` 方法来获取页面中多个 select 组件选中的值。
以下是一个示例代码:
```html
<select class="myList" multiple>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
</select>
<select class="myList" multiple>
<option value="4">选项4</option>
<option value="5">选项5</option>
<option value="6">选项6</option>
</select>
<button onclick="getSelectedOptions()">获取选中项</button>
<script>
function getSelectedOptions() {
var selectedOptions = $('.myList').map(function() {
return $(this).val();
}).get();
console.log(selectedOptions);
}
</script>
```
当用户点击“获取选中项”按钮时,`getSelectedOptions` 函数会获取所有 class 为 `myList` 的 select 元素的选中项,然后将所有选中项的值输出到控制台。
注意,由于 select 元素有多选和单选两种模式,如果要获取所有选中项的值,需要将 select 元素的 `multiple` 属性设置为 `true`。另外,`map()` 方法会返回一个包含所有选中项的值的数组,可以通过 `get()` 方法将其转换为普通的 JavaScript 数组。
阅读全文