Question

我使用Select2（版本4.0.2）允许用户选择多个值并为其制作标签。问题是，在选择新标签后扩展标签的范围时，下拉值列表区域不会相应地重新定位。

此图显示SelectSe区域包含几个先前选择的值，然后选择其他值：

Figure 1 http://oi68.tinypic.com/ev5m5k.jpg

此图显示了选择一个或多个选项后会发生的情况，这些选项因为标签区域高于隐藏而被隐藏，但下拉选项列表卡在相同的位置：

Figure 2 http://oi67.tinypic.com/63sozk.jpg

如果我从标记区域（模糊）获取焦点，则下拉列表会在适当的位置重新显示，以显示所有当前选定的值/标记：

Figure 3 http://oi68.tinypic.com/sczy81.jpg

问题

如果选择新标记值，如何让下拉选项区域动态重新定位？我可以拦截Select2事件并以某种方式强制它重新计算垂直位置吗？或者每次选择一个选项时，blur()然后focus()可能会超出范围？

Answer 1

我提出的解决方案是在选择或取消选择下拉选项时强制下拉元素调整大小，这需要捕获"change"事件：

// Apply Select2 to the <select> element
var select2Elem = $("#" + controlID).select2(opts);

// Force drop-down list to resize upon select/unselect
select2Elem.on("change",
    function(evt) {
        select2Elem.resize();
    }
);

不会重新定位Select2下拉列表以显示添加的标记

1 个答案: