我想在单击按钮时显示一个 ExtJS 工具提示。当用户单击“X”或第二次单击按钮时,工具提示应该消失(注意我没有说“隐藏”)。如果用户第三次点击该按钮,提示应该再次出现。
我的问题是,如果将鼠标悬停在按钮上,工具提示就会出现。 (参见 fiddle )我只希望它是单击按钮的结果。
我已尝试在“onbeforeclose()”和“beforehide()”事件中调用组件上的“remove()”以将其从 DOM 中移除,但悬停时提示仍然显示。
我还想指出,从文档中调用“close()”方法实际上并不会触发“onbeforeclose()”事件——这对我来说真的没有意义……
所有的 Sencha 示例都在悬停时显示提示。甚至可以只在点击事件后显示提示吗?
这是来自 Fiddle 的代码:
function onClick() {
window.Ext.create('Ext.tip.ToolTip', {
target: 'div123',
html: 'I am a tip',
autoShow: true,
autoScroll: true,
focusOnToFront: true,
autoHide: true,
closable: true
});
}
window.Ext.create('Ext.Button', {
id: 'btn123',
renderTo: 'div123',
text: 'click me',
width: '100px',
handler: onClick
});
我还想提一下,我知道每次单击按钮时我都会创建一个新的工具提示。我知道,这是理想的行为。我的问题是我希望在您每次单击时显示一个新提示 - 而不是在悬停时显示旧提示。
最佳答案
移除 target
将没有任何东西可以悬停。
使用 Ext.tooltip.Tooltip#show
在需要时显示工具提示的方法。
保留对创建的工具提示的引用,以便能够 destroy
需要的时候。
查看您的 updated fiddle .
最后,您确定要自动隐藏工具提示吗?这似乎与您要实现的总体目标不符...
关于javascript - 仅在单击时显示 ExtJS 工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18366621/