从工具栏项启用和禁用 ExtJS 工具提示

Posted 2023-02-26

【中文标题】从工具栏项启用和禁用 ExtJS 工具提示

【英文标题】：Enable and disable ExtJS tooltip from toolbar items

【发布时间】：2011-06-07 12:31:09

【问题描述】：

在我的toolbar 中有checkbox 用于启用和禁用tooltip。如果选中了checkbox，那么我应该启用tooltip，如果没有，我应该禁用它也可以工作。禁用tooltip后，当点击toolbar而不是toolbar中的任何项目时，它也是启用的。

toogleTooltip 是 handler 的 checkbox

function toggleTooltip() 
    debugger;
    if (Ext.getCmp("msai_tool_tip").checked) 
        Ext.QuickTips.enable();
        while (!Ext.QuickTips.isEnabled())
            Ext.QuickTips.enable();
     else 
        Ext.QuickTips.disable();
        while (Ext.QuickTips.isEnabled())
            Ext.QuickTips.disable();
    

这是我的工具栏创建代码：

Ext.QuickTips.init();
var tb = new Ext.Toolbar(
    id: 'form_menu_bar',
    renderTo: Ext.get('newproducttitle').dom,
    items: [
        tooltip: 
            text: "Click on this button to generate the template and save it in server.",
            title: "Save",
            xtype: "quicktip"
        ,
        iconCls: 'msai_save_template',
        handler: generateTemplate

    , 
        tooltip: 
            text: "Click on this button to generate the template.",
            title: "Save to clipboard",
            xtype: "quicktip"
        ,
        iconCls: 'msai_save_clipboard',
        handler: generateTemplateClipboard
    ]
);

请提出一些解决方案，以便我不应该显示tooltip，如果用户单击工具栏而不是任何项目。

【参考方案1】：

请找到下面的小提琴来检查工作示例： https://fiddle.sencha.com/#view/editor&fiddle/2c7k

代码 sn-p：

Ext.QuickTips.init();

var tb = new Ext.Toolbar(
        renderTo: document.body,
        width: 600,
        height: 100,
        items: [
            // xtype: 'button', // default for Toolbars, same as 'tbbutton'
            text: 'Button',
            tooltip: 'button'
        , 
            xtype: 'splitbutton', // same as 'tbsplitbutton'
            text: 'Split Button',
            tooltip: 'Split Button'
        , 
            xtype: 'checkbox',
            boxLabel: 'enable tooltip',
            checked: true,
            listeners: 
                check: function (checkbox, newValue, oldValue) 
                    if (newValue) 
                        Ext.QuickTips.enable();
                     else 
                        Ext.QuickTips.disable();
                    
                
            
        ]
    );