如何以编程方式更改Button的Text属性?

时间:2012-10-01 11:54:55

标签: javascript sencha-touch extjs sencha-touch-2

我正在使用Sencha Touch 2,我有一个按钮声明,在EVENT点击我想要更改其文本属性。

这是我的代码,不起作用..任何想法如何解决?

var accessibilityButton = {
        id: 'accessibilityButton',
        xtype: 'button',
        ui: 'custom-btn-confirm',
        maxWidth: '360px',
        centered: true,
        flex: 1,
        scope: this,
        style: 'color: #ffffff',
        text: 'Larger Text',

        handler: function changeStyle() {

            // Swap the CSS for Accessibility             
            var i, a, url, btn;
            btn = document.getElementById('accessibilityButton');

            for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
                if(a.getAttribute("rel").indexOf("style") != -1) {
                    url = a.href;

                    if(url.lastIndexOf('app.css') !== -1) {
                        a.href = 'resources/css/app-accesibility.css';          
                        btn.innerHTML = 'Default Text';
                    }
                    else {
                        a.href = 'resources/css/app.css';
                        btn.innerHTML = 'Larger Text';   
                    }
                } 

            }

        }

    };

1 个答案:

答案 0 :(得分:2)

你的处理函数应该在按钮组件的范围内被调用,所以只需尝试做这样的事情:

handler: function changeStyle() {
    this.setText('text');
}

修改

或者如果您更改了范围:

scope: this,
handler: function changeStyle(btn) {
    btn.setText('text');
}

请注意,第二个版本始终有效。