Bootstrap 3 select 事件

Bootstrap 3 Select 组件提供了一些事件，可以在选择发生变化时触发。以下是一些常用的事件：

1. `changed.bs.select`：当选择项发生变化时触发。
2. `shown.bs.select`：当下拉框展开时触发。
3. `hidden.bs.select`：当下拉框关闭时触发。
4. `loaded.bs.select`：当下拉框数据加载完成时触发。

可以通过 jQuery 的 `on()` 方法来绑定这些事件，例如：

$('#mySelect').on('changed.bs.select', function(event) {
  // 选择项发生变化时执行的代码
});

如果需要获取当前选择的值，可以使用 Select 组件的 `val()` 方法，例如：

$('#mySelect').on('changed.bs.select', function(event) {
  var selectedValue = $(this).val();
  // 处理当前选择的值
});

相关问题

Bootstrap 3 select 宽度 file

您可以通过以下方法设置Bootstrap 3 select的宽度：

1. 使用内联样式设置宽度：

<select class="selectpicker" style="width: 200px;">
  <option>Option 1</option>
  <option>Option 2</option>
  <option>Option 3</option>
</select>

2. 使用类设置宽度：

<select class="selectpicker custom-select" >
  <option>Option 1</option>
  <option>Option 2</option>
  <option>Option 3</option>
</select>

.custom-select {
  width: 200px;
}

3. 使用父元素包裹设置宽度：

<div class="form-group" style="width: 200px;">
  <select class="selectpicker">
    <option>Option 1</option>
    <option>Option 2</option>
    <option>Option 3</option>
  </select>
</div>

请注意，以上方法中的 .selectpicker 是 Bootstrap 3 select 的默认类名，您应该根据自己的实际情况进行修改。

Bootstrap 3 select 宽度 fill

如果您想让Bootstrap 3 select组件的宽度填满其父容器，您可以使用Bootstrap提供的栅格系统来实现。具体做法是将 select 元素包裹在一个具有 `col-*-*` 类的`div`元素中，如下所示：

<div class="row">
  <div class="col-md-12">
    <select class="selectpicker">
      <option>Option 1</option>
      <option>Option 2</option>
      <option>Option 3</option>
    </select>
  </div>
</div>

在这个示例中，`div`元素具有 `col-md-12` 类，这意味着它将占据其父容器的所有列，从而使 select 组件的宽度填满整个父容器。

请注意，您需要确保 select 组件的父容器也具有正确的宽度，以便 select 组件可以正确地自适应其大小。