在网页开发过程中,经常会遇到需要获取或设置 `
一、获取选中值
要获取一个 `
例如,假设有如下 HTML 代码:
```html
```
那么,通过以下 jQuery 代码可以获取当前选中的值:
```javascript
var selectedValue = $('mySelect').val();
console.log(selectedValue);
```
如果用户选择了“选项二”,控制台将输出 `"2"`。
二、获取选中项的文本内容
有时候我们不仅需要知道选中的值,还需要获取该选项的显示文本。这时可以通过 `.find(':selected')` 来找到被选中的 `
示例代码如下:
```javascript
var selectedText = $('mySelect').find(':selected').text();
console.log(selectedText);
```
这样就能得到用户实际看到的选项名称,比如“选项二”。
三、设置选中值
除了获取选中值外,jQuery 还允许我们通过 `val()` 方法来设置某个 `
```javascript
$('mySelect').val('3');
```
这会自动将 `value` 为 `"3"` 的 `
四、多选下拉框的处理
如果是多选的 `
HTML 示例:
```html
```
获取选中值:
```javascript
var selectedValues = $('multiSelect').val();
console.log(selectedValues); // 输出类似 ["a", "c"]
```
设置多个选中项:
```javascript
$('multiSelect').val(['a', 'c']);
```
五、注意事项
- 使用 `val()` 方法时,确保目标元素是 `
- 在动态生成的 `
- 如果页面中有多个 `
总结
jQuery 的 `val()` 方法为操作 `