在选择第一个引导选择时更新第二个引导选择的值答案

【问题标题】：Update value of second bootstrap select on select of first bootstrap select在选择第一个引导选择时更新第二个引导选择的值
【发布时间】：2017-01-16 08:10:51
【问题描述】：

我是 bootstrap-selectpicker 的新手。我有两个选择字段。我想知道如何根据第一个选择器的选择来更新第二个选择器的值。

<select  id="id1" name="name1" class="selectpicker"  data-live-search="true">
  <option value="A">AAA</option>
  <option value="B">BBB</option>
</select>
<select  id="id2" name="name2" class="selectpicker"  data-live-search="true">
  <option value="A">AAA</option>
  <option value="B">BBB</option>
  <option value="C">CCC</option>
  <option value="D">DDD</option>
</select>

Javascript 代码：

$('.selectpicker').selectpicker({
  style: 'btn-info',
  size: 4
});

上面的 JS 代码初始化了两个选择器。我错过了什么吗？或者这是错误的初始化方式？有人可以提供使用多个引导选择器的示例吗？

【问题讨论】：

标签： javascript jquery bootstrap-selectpicker

【解决方案1】：

你可以的

$('.selectpicker').on('changed.bs.select', function (e) {
  if($(this).attr('name')=="name2"){
      $(".selectpicker[name='name1']").val(/*set value*/);
  }
  else{
      $(".selectpicker[name='name2']").val(/*set value*/);
  }
});

changed.bs.select是图书馆的一个事件，你可以看看here

【讨论】：

【解决方案2】：

试试这个我希望这会奏效如果您的第一个选择值为 1，那么在第二个选择中将仅选择与第一个选择相同的值

$("#select1").change(function(){  

if ($(this).data('options') == undefined){
$(this).data('options', $('#select2 option').clone());  

}  var id = $(this).val();  

var options = $(this).data('options').filter('[value=' + id + ']');

 $('#select2').html(options);
});

【讨论】：

【解决方案3】：

如果您愿意，可以通过 ID 单独初始化它们，但这不是必需的：

$('#id1').selectpicker({
  style: 'btn-info',
  size: 4
});
$('#id2').selectpicker({
  style: 'btn-info',
  size: 4
});

根据第一个选择更新 selectpicker 的第二个值很容易。当您更改第一个 selectpicker 的值时，您应该只获取第一个 selectpicker 的值

var result = $('select[name=name1]').val();

然后将其设置为另一个

$('select[name=name2]').val(result);
$('#id2').selectpicker('refresh');

【讨论】：