w2ui网格列标题工具提示或泡泡头

Question

有没有办法为w2ui网格的列标题添加工具提示或气泡头？

我需要一些东西来解释这个专栏的内容。

我找到了以下链接，但它们似乎已经过时，不再与w2ui v1.4或v1.5 +相关，或者我只是愚蠢到不能让它们工作。

• https://github.com/vitmalina/w2ui/issues/816：我尝试使用fungms或eliavmaman来解决问题，但它们似乎不适用于较新的w2ui版本。
• https://github.com/vitmalina/w2ui/issues/820：似乎过时了。无法确切地知道需要做什么。

任何帮助或指导都非常适合。

Answer 1

列标题可能包含任何HTML，因此以下三种方法可以实现您的目标：

1. 叠加层，或
2. 使用包装DIV或
3. 使用内置工具提示属性。

CSS（仅在您选择重叠尝试时才需要）：

.tt{
   position: absolute !important;top: 0 !important;right: 0 !important;bottom: 0 !important;left: 0 !important;
}

JS：

var c1 = 'First Name' + '<i class="tt" title="Your Tooltip text"></i>';
var c2 = '<div title="This is a tooltip ...">Last Name</div>';

$(function () {
    $('#grid').w2grid({ 
        name: 'grid', 
        columns: [                
            { field: 'fname', caption: c1, size: '30%' },
            { field: 'lname', caption: c2, size: '30%' },
            { field: 'email', caption: 'Email', size: '40%', tooltip: "Hello World" }
        ]
    });    
});

小提琴：http://jsfiddle.net/kwpd6dm6/1/

由您决定使其更加花哨，例如通过将其设置为气泡或使用现有的工具提示库。