Question

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

我知道有一种名为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

如果是这样，我正在使用相同的插件，并且我还希望在显示下拉列表时立即关注“过滤器”输入。为了解决这个问题，我使用onDropdownShown事件将立即焦点置于过滤区域内。我的代码现在看起来像这样，它完美无缺。单击下拉列表，可以立即开始键入和过滤。

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

bootstrap-multiselect下拉列表 - 专注于搜索并实现预先输入功能

1 个答案: