bootstrap获取下拉框选中的值
时间: 2023-07-16 08:13:36 浏览: 126
可以使用 jQuery 来获取 Bootstrap 下拉框(Dropdown)选中的值,具体方法如下:
1. 给下拉框添加 ID 或 Class,例如:
```html
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
下拉框
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">选项一</a>
<a class="dropdown-item" href="#">选项二</a>
<a class="dropdown-item" href="#">选项三</a>
</div>
</div>
```
2. 使用 jQuery 选择器选中下拉框,并通过 click 事件监听选项的点击:
```javascript
$(document).ready(function(){
$(".dropdown-menu a").click(function(){
var selectedValue = $(this).text();
console.log(selectedValue);
});
});
```
在这个例子中,我们监听了下拉框菜单中选项的点击事件,当用户点击任何一个选项时,我们使用 `$(this)` 获取当前被选中的选项,并使用 `text()` 方法获取选项的文本内容。最后,将选项的文本内容打印到控制台中。
阅读全文