Xtype 中的红色星号：'label'答案

【问题标题】：Red asterisk in Xtype :'label'Xtype 中的红色星号：'label'
【发布时间】：2017-02-15 07:43:52
【问题描述】：

我想在文本后面加上一个红色星号。有没有办法在js代码中直接添加css代码？例如参数样式，但仅适用于星号。我正在使用 Extjs 3.4

这里是代码。

{
xtype: 'label',
style: "font-size:11px;font-weight:bold;",
 text: 'Note<span style="color:red">*</span>  If any job applicant is failed,you can find it in the error log.',
// fieldLabel: 'Note<span style="color:red">*</span>: If any job applicant is failed,you can find it in the error log.',
 }

如果我使用fieldLabel，则仅在左侧打印完整的文本。并且 span 适用于 "fieldLable"，但 span 不适用于 "text"。

【问题讨论】：

标签： extjs extjs3

【解决方案1】：

使用html 而不是text。

Ext.onReady(function() {
    new Ext.FormPanel({
    height: 100,
    renderTo: Ext.getBody(),
    items: [{
        xtype: 'label',
style: "font-size:11px;font-weight:bold;",
 html: 'Note<span style="color:red">*</span>  If any job applicant is failed,you can find it in the error log.',
    }]
});
});

<link rel="stylesheet" href="https://cdn.sencha.com/ext/gpl/3.4.1.1/resources/css/ext-all.css">
<script type="text/javascript" src="https://cdn.sencha.com/ext/gpl/3.4.1.1/adapter/ext/ext-base-debug.js"></script><script type="text/javascript" src="https://cdn.sencha.com/ext/gpl/3.4.1.1/ext-all-debug.js"></script>

【讨论】：

【解决方案2】：

在标签后添加面板为：

{
    xtype: 'label',
    forId: 'myFieldId',
    text: 'Note',
},{
    xtype:'panel',
    html:'<span style="color:red;">*</span> If any job applicant is failed,you can find it in the error log.'
}

【讨论】：

【解决方案3】：

这是另一种解决方案。使用类和 :before。 fiddle

【讨论】：