1

在从select2 3.5 -> 4.0切换的过程中。我现在遇到了在 boostrap 模态中使用时出现问题的情况。

在 3.5 中,我使用了这样的东西,使它们能够正常运行:

.modal-open .select2-drop-mask {
  z-index: 10051;
}

.modal-open .select2-drop {
  z-index: 10052;
}

.modal-open .select2-search {
  z-index: 10053;
}

4.0 中的类和其他很多东西都发生了变化,这不再有任何作用。我假设问题与 z-index 相关,但不确定。我select在模态之外测试了相同的内容,它按预期工作,这就是为什么我假设它与 css 相关。输入显示,但下拉、搜索等不显示。有没有其他人遇到过这个并找到了解决方案?

编辑jsfiddle:

这与我的用例略有不同 - 我使用load()将远程内容注入模态然后将其显示出来,但同样的问题在这里发生。您无法专注于搜索输入以键入任何内容。奇怪的是,我注意到它在 Internet Explorer 11 中有效,但在最新的 Firefox、Chrome 或 Safari 中无效。

模态小提琴

4

1 回答 1

1

我解决了这个问题。您只需删除模态 div 中的 'tabindex="-1" ':

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

于 2015-06-11T08:04:59.677 回答