Question

根据问题和文章的数量，简单的tip.html = 'new value';应该有效，但由于某些原因，对我来说并非如此。

在这里，我创建了一个演示，演示tip.html修改在渲染一次后不会改变尖端的身体：

http://jsfiddle.net/zcYqe/1/

重现的步骤：

情景1：

将鼠标移到红色方块上以查看提示
按按钮
查看提示未更改

情景2：

按下按钮（不是 - 不要将鼠标放在红色方块上）
查看提示的值已更改

我错过了什么？如何在运行时更改它（场景1）？

Answer 1

您不能只设置属性，一旦创建了组件，您需要调用一个方法，以便它实际更新底层DOM：

tip.update('new');

Answer 2

您可以使用ExtJS 4.2.x中的beforeshow侦听器（可能更早）完成此操作。

var changeCount = 1;

var tip = Ext.create('Ext.tip.ToolTip', {
    target: 'hoverme',
    html: 'Press this button to clear the form',
    listeners: {
        // Change content dynamically depending on which element triggered the show.
        beforeshow: function updateTipBody(tip) {
            tip.update( "Changed " + changeCount + " times" );
            changeCount ++;
        }
    }

});

document.getElementById('btn').addEventListener('click', function(e) {
    tip.html = 'new';
    return false;
})

如何在运行时更改ExtJS ToolTip文本？

2 个答案: