layui 表格toolTip

## 表格鼠標移入彈出顯示

##### 使用方法

1、在layui 的table中的cols使用templet並在templet中使用tooltip包裹實際的內容

```
{field: 'startTime', align:'left',title: '發起時間',width:'12%',templet:function(d){
    return '<tooltip>' + createTime(d.startTime) + '</tooltip>'
}}
```

2、在table.render的down中添加renderTooltip()方法

```
// 渲染表格
    var tableResult = table.render({
        elem: '#' + orderProperty.tableId,
        url: ,
        method:'POST',
        contentType: 'application/json',
        //toolbar: '#toolbar', 
        where:{
            param:{
                flowType:flowType,
                workcardType:workcardType,
                workcardTypes:workcardTypes
            }
        },
        defaultToolbar: false,
        request: {
            pageName: 'pageNum', //頁碼的參數名稱，默認：page
            limitName: 'pageSize' //每頁數據量的參數名，默認：limit
           },
        parseData: function(res){ //res 即為原始返回的數據
            if(res.code == 200) res.code = 0;
            return {
              "code": res.code, //解析接口狀態
              "msg":  res.msg, //解析提示文本
              "count": res.data.total, //解析數據長度
              "data": res.data.list //解析數據列表
            };
        },
        page: true,
//        height: tableHeight,
        cellMinWidth: 100,
        cols: orderProperty.initColumn(),
        done: function (res, curr, count) {
//            $('tr > td').css({'height':'95px'});
//            $('.layui-table-page').css({'border-width':'0px'});
            $('.layui-table-page').attr("align","right");
            console.info("============activiti/queryMyWorkFlowLists========done========");
            renderTooltip()
        }
    });
```

##### 頁面取消原生展開

css中加入

```
[lay-id="orderTable"] .layui-table-grid-down{
    display: none
}
```

其中orderTable為表格id

##### 生成代碼

位於js/utils.js中

```
function renderTooltip(){
    var tooltip 
    $("tooltip").each(function(index,element){
        var parent = element.parentElement
        element.onmouseenter = function(){
            if(parent.offsetWidth - 30 < element.offsetWidth){
                tooltip = layer.open({
                    type: 4,
                    content: [element.innerText, element], //數組第二項即吸附元素選擇器或者DOM
                    shade: 0,
                    tips: 1
                  });
            }
        }
        parent.onmouseleave = function(){
            layer.close(tooltip);
        }
     });
}
```