Datatables无法正常显示下拉菜单
如图所示:
产生原因:datatables自动生成页面代码,导致z-index失效
产生原因参考: https://blog.csdn.net/apple_01150525/article/details/76546367
解决办法:
在页面内加入datatableMenu元素如图所示
然后根据需要下拉的下三角按钮的在页面中位置去添加下拉菜单的内容
//下拉三角的位置
$(document).on('click','.fa-caret-down',function(e){
$(document).find('.datatableMenu')
.empty()
.css({
'position':'absolute',
'left':$(this).offset().left+'px',
'top':($(this).offset().top+15)+'px',
})
.show()
.append('<ul class="dropdownMenu"><li><a class="dimensionLink"></a></li><li><a ><i class=" fa fa-line-chart fa-lg" title="分日数据"></i></a></li></ul>')
$(document).one("click", function(){
$(document).find('.datatableMenu').hide();
});
e.stopPropagation();
});
$(document).on('click','.datatableMenu',function(e){
e.stopPropagation();
});