bootstrap-multiselect下拉菜单-设置搜索焦点并实现typeahead功能

Question

我希望有一个解决方案来解决这个问题，因为我觉得它会让我的界面更加用户友好。在阅读了bootstrap-multiselect文档后，我找不到一种方法来知道当你点击下拉菜单时如何在搜索框上实现焦点，而且我还想添加type功能。

我知道有一种名为enablefiltering的方法，可以将搜索框添加到下拉列表中，但不确定如何向其添加焦点。

指令看起来像这样：(请注意，这只是指令的一部分，我认为这是应该应用ngfocus的部分，但我可能错了)

return {
        scope: {
            callback: "&",
            ngModel: "="
        },
        link: function (scope, element, attrs) {

            element.multiselect({
                maxHeight: attrs.maxHeight ? attrs.maxHeight : 300,
                includeSelectAllOption: attrs.includeSelectAllOption === undefined || attrs.includeSelectAllOption === null ? true : attrs.includeSelectAllOption === 'true',
                selectedClass: 'active',
                enableFiltering: true,
                enableCaseInsensitiveFiltering: true,
                nonSelectedText: attrs.nonSelectedText ? attrs.nonSelectedText : 'All',
                numberDisplayed: attrs.numberDisplayed ? attrs.numberDisplayed : 2,
                buttonContainer: attrs.buttonClass ? '<div class="btn-block">' : '<div class="btn-group">',
                buttonClass: attrs.buttonClass ? attrs.buttonClass : 'btn btn-default btn-xs',
                buttonWidth: '100%',
                onChange: function(element, checked) {
                    scope.callback();
                }
            });

不管怎样，要添加这些功能吗？

谢谢

Answer 1

这个问题是针对这个插件的吗？

bootstrap-multiselect

如果是这样，我正在使用相同的插件，并且我还希望在下拉列表显示时立即在"filter“输入中获得焦点。为了解决这个问题，我使用了onDropdownShown事件将焦点立即放在过滤器区域内。我的代码现在看起来像这样，它可以完美地工作。你点击下拉菜单，就可以立即开始输入和过滤。

$('#other-major').multiselect({
   maxHeight: 200,
   numberDisplayed: 20,
   onDropdownShown: function(even) {
      this.$filter.find('.multiselect-search').focus();
    },
enableCaseInsensitiveFiltering: true });