如何聚焦引导选择选择器

Question

我使用 data-live-search 作为可搜索选项。 当我点击焦点按钮时，它应该再次聚焦选择。 我使用了以下代码

 $("#focus").click(function() { $(".selectpicker").focus(); });

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.js"></script> <select data-live-search="true" data-live-search-style="startsWith" class="selectpicker"> <option value="4444">4444</option> <option value="Fedex">Fedex</option> <option value="Elite">Elite</option> <option value="Interp">Interp</option> <option value="Test">Test</option> </select> <button id="focus">focus</button>

每当我按 Enter t 时，焦点是选择框，但未显示搜索选项。 我附上了屏幕截图请给我建议，以便在我输入时显示带有搜索选项的正确选项

Answer 1

focus()不起作用，因为它转向自定义select而不是本机选择选项，顺便说一下，在selectpicker插件中有一种本机方法可以做到这selectpicker ，一个名为toggle的事件

 $("#focus").click(function() { // toggle $('.selectpicker').selectpicker('toggle'); // select by value $('.selectpicker').selectpicker('val', 'Test'); $('.remove-example').selectpicker('refresh'); // change highlight $('.dropdown-menu li').removeClass('active') });

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.js"></script> <select data-live-search="true" data-live-search-style="startsWith" class="selectpicker"> <option value="4444">4444</option> <option value="Fedex">Fedex</option> <option value="Elite">Elite</option> <option value="Interp">Interp</option> <option value="Test">Test</option> </select> <button id="focus">focus</button>