Question

我正在使用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
                          });
                    }
                }

            });

Answer 1

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

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;
}

ExtJS 2.3：复选框boxlabel上的工具提示

1 个答案: