1

我有一个简单的 Ext JS 表单（4.1，但在 4.2 中似乎可以重现）。该表单包含一些textareas，我想emptyText在其中一个 textareas 上使用该属性。我的问题是，当我使用 时emptyText，Chrome 中的控件在emptyText获得焦点时会稍微变小，然后在失去焦点时恢复其原始大小。在 IE9 中，它的大小始终保持不变。

我可以看到这种样式正在应用于我的文本区域，其中包含emptyText：

.x-webkit .x-form-empty-field {
    line-height: 15px;
}

我不确定为什么需要这种样式，我也不确定为什么它会在应用时改变 textarea 的高度，但确实如此。textarea不使用的AemptyText有一个line-height: normal;.

我怎样才能消除这种调整大小？

这是一个小提琴：http: //jsfiddle.net/YM5sa/

这是代码（也在小提琴中）：

Ext.onReady(function() {    

    Ext.create('Ext.form.Panel', {
        renderTo: Ext.getBody(),
        fieldDefaults: {
            labelAlign: 'top'
        },
        defaults: {
            xtype: 'panel',
            border: 'false'
        },
        items: [
            {
                xtype: 'textarea',
                fieldLabel: 'One',
                name: 'one',
                width: 200
            },
            {
                xtype: 'textarea',
                fieldLabel: 'Two',
                name: 'two',
                emptyText: "Bacon ipsum dolor sit amet cow jerky shank bresaola swine", 
                width: 200                  
            }
        ]
    });

});
4

1 回答 1

2

我通过line-height在textarea. 这似乎很好地覆盖了.x-webkit .x-form-empty-field的 line-height 值。

{
    xtype: 'textarea',
    fieldLabel: 'Two',
    name: 'two',
    emptyText: "Bacon ipsum dolor sit amet cow jerky shank bresaola swine", 
    width: 200,
    fieldStyle: 'line-height: normal;'
}
于 2013-07-10T19:53:57.183 回答