Ext.js实现ToolTip提示

1. 需求背景

在项目背景中，填表格时，需要对所填字段做出要点提示，要求在鼠标移入提示png图标时弹出提示弹出层，任意点则关闭弹出层。

2. 实现效果

3. 代码实现

{
	xtype: 'image',
	id: "generalCmdTip",
	src: "../../../../../../../aiots/static/img/icon/tip.png",
	colspan: 1,
	width: 18,
	margin: '0 10 0 10',
	listeners: {
		afterrender: function (c) {
			Ext.create('Ext.tip.ToolTip', {
				target: c.getEl(),
				autoHide: false, 
				html: "<font color='red'>通用指令使用说明：</font><br>" +
					"遵循JT701标准协议格式<b>(指令,参数1,参数2,...)</b>，如<br>" +
					"开启不休眠模式：<b>(P54,1,1)</b><br>" +
					"关闭不休眠模式：<b>(P54,1,0)</b><br>"
			});
		},
		el: {
			click: function () {
				//window.open("../Desktop");
			}
		}
	}
}

4. 参考资料

参考资料：

药到病除-Extjs6图片控件功能扩展，增加tip和点击事件
lipan-ExtJs4 笔记（7） Ext.tip.ToolTip 提示