如果单击工具，则输出工具提示

Question

您好我有一个带工具的窗口。我有这个工具：＆＃39; help＆＃39;，点击它时，我希望它输出一个工具提示，其中包含我的HTML文件中的文字，但实际上它会显示警告（＆＃39;帮助＆＃39;），以及它不会从文件中输出：

tools: [
    {
        type: 'refresh',
        name: 'refresh',
        tooltip: 'reload'
    },
    {
        type: 'help',
        handler: function (event, toolEl, panel) {
            alert('Help');

            var tooltips = [{
                    target: 'tip1',
                    html: 'A very simple tooltip'
                }, {
                    target: 'ajax-tip',
                    width: 200,
                    autoLoad: {url: '/help/note/help.html'},
                    dismissDelay: 15000 // auto hide after 15 seconds
                },
            ];

            Ext.each(tooltips, function (config) {
                Ext.create('Ext.tip.ToolTip', config);
            });
        },
    }
]

这张照片展示了我真正想要的东西：

Answer 1

您需要从服务器加载Ajay请求中的html文件，然后在成功回调中创建工具提示。

Ext.Ajax.request({
  url: '/help/note/help.html',
  success: function(response){
    // in the success callback you get the html text in the response.responseText
    // and then you can create a tooltip with the content of it
  }
});

因此，您可以在回调中执行以下操作

var html = response.responseText;
var tooltip = {
                target: 'ajax-tip',
                width: 200,
                html: html,
                dismissDelay: 15000 // auto hide after 15 seconds
            };

完整的代码应该是

{
    type: 'help',
    handler: function (event, toolEl, panel) {
        Ext.Ajax.request({
            url: '/help/note/help.html',
            success: function (response) {
                var html = response.responseText;
                var tooltip = {
                    target: 'ajax-tip',
                    width: 200,
                    html: html,
                    dismissDelay: 15000 // auto hide after 15 seconds
                };
                Ext.create('Ext.tip.ToolTip', tooltip);
            }
        });
    }
}