Extjs 向图像添加工具提示

无法理解为什么我的代码不工作，有没有办法用extjs在图像上显示工具提示

var img = Ext.create('Ext.Img', {
        src : 'img/ampoule.png',
        width : 30
});

var tip = Ext.create('Ext.tip.ToolTip', {
    target: img.getEl(),
    html: 'tooltip'
});

我的形象就在一个树面板的摘要中，就像这样：

dockedItems: [{
    xtype: 'toolbar',
    dock: 'top',
    items: [{
        fieldLabel: 'Search',
        /*****code code code everywhere*****/
        }
    ,
    img
   ]
}]

---

我没有使用extjs的经验，但我倾向于将工具提示问题委托给css。 根据经验，当我可以避免不必要的javascript时，我会这样做

使用pseudo元素，您可以简单地做到这一点

.img_tooltip:hover:after {
     content: attr(alt);
}

为此，您需要img标记（由extjs生成）如下所示

<img src="img/ampoule.png" alt="text of your tooltip" class="img_tooltip" />

另外，您可以非常轻松地设置工具提示的样式，甚至设置它们的动画

---

我希望这有帮助。

问题可能是，当您尝试向图像组件的元素添加工具提示时，图像组件已创建，但未呈现到页面内容中

在渲染图像组件后尝试添加工具提示：

var img = Ext.create('Ext.Img', {
        src: 'http://www.sencha.com/img/v2/logo.png',
        width: 300,
        renderTo: Ext.getBody(),
        listeners: {
            afterrender: function(c) {
                Ext.create('Ext.tip.ToolTip', {
                    target: c.getEl(),
                    html: 'tooltip'
                });
            }
        }
});

---

摆弄示例：

我已经试过你的代码，一切正常。你能添加摆弄来显示你的问题吗？@Akatum无法理解它为什么不起作用。。这太复杂了，无法处理，因为这是一个包含大量数据的树面板。请再看我的帖子，我会编辑它。即使在dockeditems中声明，我也必须在布局中声明我的图像吗？我没有任何错误谢谢你的帮助绕过我的问题，它正在工作，但我想知道为什么我不能用extjs来做。谢谢！就是这样。