Question

我正在动态地将面板添加到容器中。我想在悬停时为此面板设置工具提示。怎么做？

var myPanel = Ext.create('myClass.extending panel');
myPanel.id = 'my-id';
myPanel.setTitle('myTitle');              
myPanel.collapsed = true;
this.add(myPanel);

更新：我也试过了，但没有工作

var panelToolTip = Ext.create('Ext.tip.ToolTip', {
        target: 'my-id',
        html: 'I am a tooltip on your panel.'
});
this.add(panelToolTip);

Answer 1

我通过在面板扩展类上添加以下代码来解决这个问题。

    listeners: {
    render: function () {
        this.getEl().dom.title = 'my custom tool tip';
    }
}

Answer 2

以下代码段会向指定的ID添加工具提示。

编辑：这是我的面板代码，用Firefox测试。

    var myPanel = Ext.create('Ext.panel.Panel', {
     id : 'myPanel',
                    width: 200,
                    height: 150,
                    title: 'Panels are cool',
                    collapsible: true,
                    renderTo: Ext.getBody(),
                    .. .some other properties
});
 var tip = Ext.create('Ext.tip.ToolTip', {
                target: 'myPanel',
                html: 'I am a tooltip on myPanel'
            });

Answer 3

如果要显示两个单独的工具提示，可以使用以下方式。

listeners: {
"collapse": function () {
    this.getEl().dom.title = 'collapse tooltip';
},
"expand": function () {
    this.getEl().dom.title = 'expand tooltip';
}
},

extjs中面板的工具提示

3 个答案: