在使用 jQuery 进行前端开发时，经常需要获取 ` 一、获取方式总结 | 方法 | 说明 | 示例代码 | | `$('select').val()` | 获取当前选中的值（适用于单选） | `var selectedValue = $('select').val();` | | `$('select option:selected').text()` | 获取当前选中项的文本内容 | `var selectedText = $('select option:selected').text();` | | `$('select option:selected').val()` | 获取当前选中项的值（与 `val()` 类似） | `var selectedValue = $('select option:selected').val();` | | `$('select').find('option:selected')` | 找到选中项并进行进一步操作 | `var $selectedOption = $('select').find('option:selected');` |
二、适用场景说明 - 单选下拉框：使用 `$('select').val()` 即可直接获取选中值。 - 多选下拉框（`multiple="multiple"`）：此时 `val()` 返回的是一个数组，表示所有被选中的值。 ```javascript var selectedValues = $('select').val(); ``` - 获取选中项的文本：如果需要显示选中的文字内容，可以使用 `option:selected` 选择器结合 `.text()` 方法。 - 操作选中项：若需对选中项进行更复杂的处理（如修改属性、添加类等），可以通过 `find('option:selected')` 获取元素对象后再操作。 三、注意事项 1. 确保 DOM 加载完成：在使用 jQuery 操作 DOM 前，应确保元素已加载，通常放在 `$(document).ready()` 或简写为 `$()` 中。 2. 区分单选和多选：多选情况下 `val()` 返回的是数组，需注意处理方式。 3. 避免重复选择器：尽量复用已有的 jQuery 对象，提高性能。 四、总结 通过 jQuery 获取 ` |