更新 - 2016/12/05

Question

http://www.bootply.com/YAQrE52K6X

    $("#dataCombo").selectpicker({
    multiple:true
    });

    <div class="container">

  <h3>Multiple Select</h3>
  <select id="dataCombo" class="selectpicker" data-live-search="true" multiple="multiple" style="width:400px;">

    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
    <option value="four">Four</option>
    <option value="five">Five</option>
    <option value="six">Six</option>
  </select>

</div>

我想关闭自动对焦，因此输入不会要求我在点击下拉列表后立即搜索。试图使用.blur等......但到目前为止还没有。寻找解决方案。移动使用＆＃34; bootstrap-select＆＃34;来自＆＃34; select2＆＃34;由于同样的问题。设备上的键盘显示为覆盖多个下拉项目

Answer 1

我无法使用bootstrap-select解决此问题（似乎他们在触发show.bs.select和shown.bs.select事件时遇到了一些问题），但是因为您还提到过您尝试使用select2 ，这是select2的解决方案：

  $("#dataCombo").select2({
    closeOnSelect: false
  });
  $("#dataCombo").on('select2:open', function () {
    $(document.activeElement).blur()
  });

检查此示例：
https://jsfiddle.net/yw61h28z/

更新 - 2016/12/05

管理让它发挥作用（花一些时间玩焦点/模糊/目标事物）。

$(document).ready(function() {
  $("#dataCombo").select2({
    closeOnSelect: false
  });
  $("#dataCombo").one('select2:open', function (e) {
    $(document.activeElement).blur()
  });
  $("#dataCombo").on('select2:close', function(e) {
    if ($(event.target).parents('.select2').length) {
      // The closing was done inside the select2 container
    } else {
      $("#dataCombo").one('select2:open', function (e) {
        $(document.activeElement).blur()
      });
    }
  });
});

这是我原来的jsfiddle的更新：
https://jsfiddle.net/yw61h28z/4/

以下是代码背后的想法：
  1.第一次打开select2 - 模糊input（但只有一次） - 这确保了select2菜单被打开，但input没有聚焦（所以键盘不是显示）。
  2.关闭select2菜单 - 检查导致关闭的元素   2.1。如果该元素是select2块的一部分 - 忽略它并关闭继续关闭菜单   2.2其他 - 下次打开select2菜单时，我们blur input（再次 - 只有1次）。

Answer 2

对于引导程序选择器，您可以像这样对我有用：

$(document).on("change","select.selectpicker",function(){
    $(this).next().next().children(".bs-searchbox").children("input[type='search']").blur()
});

为bootstrap-select / select2

2 个答案:

更新 - 2016/12/05