extjs 当我跨过按钮时，它会变成灰色

omtl5h9j 于 2022-11-05 发布在其他

关注(0)|答案(2)|浏览(163)

new Ext.Button({

    text: '<div style="color: white">INFORMA</div>'
    ,style: {
       'background-color': '#0099ff',
       'border-radius': '5px',
       'padding-left': '5px',
       'padding-right': '5px',
       'padding-top': '1px',
       'padding-bottom': '1px'
   }
    ,handler : function() {
        .....
        ...
    }
})

我的问题是，当我把鼠标放在按钮上时，它会变成灰色，而我希望它保持和以前一样的颜色，蓝色。我该如何修复它呢？
在鼠标到达顶部之前：
before
当鼠标移到顶部时：
after

extjs

来源：https://stackoverflow.com/questions/65507015/when-i-step-over-the-button-it-turns-gray-extjs

2条答案

按热度按时间

ep6jt1vc1#

这就是我如何解决的，因为Ext.define不工作，感谢@Arthus Rubens的代码：

Ext.override(Ext.Button,{
    onMouseOver: function (e) {
        if (!this.disabled) {
            var internal = e.within(this.el, true);
            if (!internal) {
                if (!this.monitoringMouseOver) {
                    this.doc.on('mouseover', this.monitorMouseOver, this);
                    this.monitoringMouseOver = true;
                }
                this.fireEvent('mouseover', this, e);
            }
            if (this.isMenuTriggerOver(e, internal)) {
                this.fireEvent('menutriggerover', this, this.menu, e);
            }
        }
    },

    onMouseOut: function (e) {
        var internal = e.within(this.el) && e.target != this.el.dom;
        this.fireEvent('mouseout', this, e);
        if (this.isMenuTriggerOut(e, internal)) {
            this.fireEvent('menutriggerout', this, this.menu, e);
        }
    }
});

调用handleMouseEvents的第二种方法：false

new Ext.Button({
    text: '<div style="color: white">INFORMA</div>',
    handleMouseEvents:false
    ,style: {
        'background-color': '#0099ff',
        'border-radius': '5px',
        'padding-left': '5px',
        'padding-right': '5px',
        'padding-top': '1px',
        'padding-bottom': '1px'
    },
    renderTo: Ext.getBody(),
    handler: function () {}
})

赞(0）回复(0）举报 2022-11-05

8tntrjer2#

以下覆盖将删除鼠标悬停时的颜色：

Ext.define('Override.Button', {
    override: 'Ext.Button',
    onMouseOver: function (e) {
        if (!this.disabled) {
            var internal = e.within(this.el, true);
            if (!internal) {
                //this.el.addClass('x-btn-over');
                if (!this.monitoringMouseOver) {
                    this.doc.on('mouseover', this.monitorMouseOver, this);
                    this.monitoringMouseOver = true;
                }
                this.fireEvent('mouseover', this, e);
            }
            if (this.isMenuTriggerOver(e, internal)) {
                this.fireEvent('menutriggerover', this, this.menu, e);
            }
        }
    },

    // private
    onMouseOut: function (e) {
        var internal = e.within(this.el) && e.target != this.el.dom;
        //this.el.removeClass('x-btn-over');
        this.fireEvent('mouseout', this, e);
        if (this.isMenuTriggerOut(e, internal)) {
            this.fireEvent('menutriggerout', this, this.menu, e);
        }
    }
});

new Ext.Button({
    text: '<div style="color: white">INFORMA</div>',
    style: {
        'background-color': '#0099ff',
        'border-radius': '5px',
        'padding-left': '5px',
        'padding-right': '5px',
        'padding-top': '1px',
        'padding-bottom': '1px'
    },
    renderTo: Ext.getBody(),
    handler: function () {}
})

或者您可以generate your own theme来更改.“x-btn-over”CSS类。

赞(0）回复(0）举报 2022-11-05

我来回答

extjs 当我跨过按钮时，它会变成灰色

2条答案

相关问题

热门标签

最新问答