Datatables无法显示弹出菜单解决办法

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();
  });
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值