ExtJS 2.3:复选框标签上的工具提示

ExtJS 2.3: Tooltip on checkbox boxlabel

本文关键字：工具提示 标签 复选框 ExtJS      更新时间：2023-09-26

我正在开发ExtJS 2.3（是的，很旧，但很旧），希望显示一个带有长标签的复选框。我可以使用CSS显示带有省略号的部分标签，但现在我想将完整标签显示为工具提示。我尝试了以下操作，但它只在复选框中添加了工具提示，而不是在标签上。有人能帮忙吗？

var checkbox = new Ext.form.Checkbox({
                boxLabel : item.displayName,
                checked : item.selected,
                name : item.internalName,
                listeners : {
                    render : function(event) {
                        Ext.QuickTips.register({
                            target: event.el,
                            text: event.boxLabel
                          });
                    }
                }
            });

使用以下代码实现了工具提示。想知道其他的评论

x.y.CheckboxWithTooltip = Ext.extend(Ext.form.Checkbox, {
    itemCls : 'checkboxCSS',
    listeners : {
        afterrender : function(event) {
            enclosingElem = event.getResizeEl();
            enclosingElem.on('mouseenter', this.onMouseEnterFunction, event);
        }
    },
    onMouseEnterFunction : function(elem, t) {
        t.qtip = this.toolTip;
    }
});

CSS定义为

.checkboxCSS .x-form-check-wrap {
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 105px;
    float: left;
    padding-bottom: 1px;
}
相关文章：