今天使用layer插件做的弹出框中,使用了select2插件,但是select2插件的下拉框无法正常显示,很显然这是由于layer弹出层z-index值比较大,导致了select2的下拉框被遮住了。解决这个的方法一般就是增大select2下拉框的z-index值,或者减小layer的弹出框的值。虽然可以使用直接修改源码的方式去修改这个值,但是一般不建议这么做,因为这么做很可能会导致其他无法预料的问题。事实上,layer和select2也都提供了解决类似问题的方法。
方法一:修改layer的z-index值:
layer的参数设置中有z-index的设置,默认是作者的生日(19891014),可将这个值修改为较小的值。如99
这样设置完了之后,就能正常显示了:
第二种方法,是设置select2的dropdownParent参数:
将该参数设置为,layer容器:
这样设置完之后,select2的下拉框也能正常显示,总的来说还是推荐第二种方式,因为第二种方式,会根据据父容器的z-index值自动调整,这样即使有多个弹出层,也不会出现意外的情况。