如何在其他div上显示下拉列表？

Question

所以我有一个表，通过更改css中可滚动的表，我可以水平滚动它。

但是，下拉菜单开始以可滚动的方式在表的末尾附近切断。因此，下拉菜单在技术上是可见的，但您必须将光标放在下拉菜单附近并尝试向下滚动以查看下拉菜单的其余部分。我试图使overflow-y隐藏，这会禁用垂直滚动，但是没有使下拉菜单超过其他div。当然还有z-index ..

所以在代码片段之前它看起来像这样（因为你可以选择按钮）：

        $('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'overflow-x' : 'auto'});
        $('.dropdown-toggle').css({'z-index' : 9999});
        $('.dropdown-menu').css({'z-index' : 9999});
        $('.li').css({'z-index' : 9999});

在代码之后，它看起来像这样：

如何让表格水平滚动，仍然可以像往常一样显示下拉菜单？那么下拉菜单会覆盖页码吗？

Answer 1

将您的下拉菜单设置为fixed位置，替换您的代码：

$('.dropdown-menu').css({'z-index' : 9999});

为：

$('.dropdown-menu').css({'position' : 'fixed', 'z-index' : 9999});

但是位置固定会有其他问题...

或而不是固定位置使您的table-scrollable具有固定的高度，因此它总是允许下拉列表适合它的高度而不隐藏它，更改：

$('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'overflow-x' : 'auto'});

为：

$('.table-scrollable').css({'display' : 'inline-block', 'width' : '100%', 'min-height': '200px', 'overflow-x' : 'auto'});

（我猜你的问题是overflow，当你表中没有数据时）