如何使用 extjs4.2 创建单个 运行 文本？

Question

如何在 Extjs4.2 中创建 运行 非标准 HTML 元素之类的文本？

这是我到目前为止完成的代码片段：

Ext.Loader.setConfig({
    enabled: true,
    paths: {
        Ext: '.'
    }
});

Ext.require([
    'Ext.form.*',
    'Ext.XTemplate']);

Ext.onReady(function () {
    //Ext.Msg.alert('Fiddle', Ext.get('info').dom.innerHTML);
    Ext.define('v_label', {
        extend: 'Ext.form.Label',
        xtype: 'runningText',
        renderTo: Ext.getBody(),

        constructor: function (config) {
            var me = this;
            var lbl = Ext.get('info').dom.innerHTML;

            this.data = {
                title: 'Title Sample',
                item: 'Item Sample'
            };
            this.tpl = lbl;
            // contentEl: 'info',
            this.height = 40;

            Ext.apply(me, config);
            me.callParent();
        }
    });

    Ext.create('v_label');
});

<script src="http://dev.sencha.com/deploy/ext-4.0.2a/ext-all-debug.js"></script>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-4.1.1-gpl/resources/css/ext-all-debug.css" />
<div id="info">
    <marquee scrollamount='4' onmouseout="this.setAttribute('scrollamount', 4, 0);" onmouseover="this.setAttribute('scrollamount', 0, 0);"><font size='5' color='red'><strong>{title} : {item}</strong></font> 
    </marquee>
</div>

我定义它以便我可以创建动态标签并动态存储来自 data:{} 的数据。

您可以看到一个 运行 文本，但它是双倍的。我尝试将 marquee 标签存储到 tpl 中，但我卡住了，因为 single quotes、double quotes 和 javascript to change the attribute marquee.

我的问题是： 如何将其设为单个 运行 文本？

或者，

也许还有其他方法可以在 extjs4.2 中创建 运行 文本？

Answer 1

根据您的代码，按如下方式更改 lbl。

// use backslash
var lbl = '<div id=\'info\'><marquee scrollamount=\'4\' onmouseout=\"this.setAttribute(\'scrollamount\', 4, 0);\" onmouseover=\"this.setAttribute(\'scrollamount\', 0, 0);\"><font size=\'5\' color=\'red\'><strong>{title} : {item}</strong></font></marquee></div>';