Bootstrap气泡弹出框（Popovers）集成到easyui列表

步骤一、引入bootstrap文件

<link rel="stylesheet" href="../../common/plugins/bootstrap/css/bootstrap.min.css">
<script type="text/javascript" src="../../common/plugins/bootstrap/js/bootstrap.min.js" charset="utf-8"></script>

步骤二、easyui表格

<table id="dg"></table>  

步骤三、javascript代码

表格操作列渲染formatter：

$('#dg').datagrid({    
    tableId: 'filesTable', //表格Id
    url:'datagrid_data.json',    
    columns:[[    
       {field: 'fileName', title: '文件名称', width: '100%', align: 'left',halign:'center', formatter: formatOper}
    ]]    
}); 

操作列渲染，加要传递的参数属性及data-toggle='popover'

 //操作列
function formatOper(value, row, index) {
	return "<a id='"+row.fId+"' data-toggle='popover' data-container='body'>"+ value+ "</a>";         
}

表格加载完成，处理气泡块(传递参数到气泡块渲染)

//表格加载完成，处理渲染的气泡按钮
$("#filesTable").datagrid({
    onLoadSuccess:function(){
	 $('[data-toggle="popover"]').each(function(){
		   var element=$(this);
		   var id=element.attr("id");//获取按钮渲染的属性，传递给气泡操作块
		   var fval=element.html();
		   var txt=element.html();
		   var hideT;
		   element.popover({
			   trigger:'manual',
			   placement:'bottom',
			   title:txt,
			   html:'true',
			   content:ContentMethod(id,fval),
		   }).on("mouseenter",function(){
			   var _this=this;
			   
			   //解决多个弹框出现的问题
			   clearTimeout(hideT);
			   if(txt!=$(".popover-title").text()){
				   $(".popover-title").parent().css('display','none'); 
			   }
			   
			   $(this).popover("show");
			   //$(".popover-title").parent().attr("id");
			   $(this).siblings(".popover").on("mouseleave",function(){
					$(_this).popover('hide');
			   });
		   }).on("mouseleave",function(){
			   var _this=this;
			   hideT=setTimeout(function(){
				  if(!$(".popover:hover").length){
					  $(_this).popover('hide');
				  }
			   },100);
		   });
	   }); 
    }
});


//气泡操作块的展示	
function ContentMethod(id,fval){
	   var tipCon='<div>';
		   tipCon+='<p><a style="color:black;" href="javascript:void(0)" onClick="showFile(\''+id+'\',0)">在线预览</a></p><hr style="margin-top:0px;margin-bottom:2px;border-bottom:pink 1px dashed;" />';
		   tipCon+='<p><a style="color:black;" href="javascript:void(0)" onClick="downloadFile(\'' +id+ '\')">下载</a></p></div>'
	   return tipCon;
}