如何将animateProperty用于TextBox背景高亮显示

How to use animateProperty for TextBox background highlight?

本文关键字：背景 高亮 显示 TextBox 用于 animateProperty      更新时间：2023-09-26

我正在尝试为dijit/form/TextBox的属性（backgroundColor）设置动画。当这不起作用时，我开始拔头发：

var node = dom.byId("myTextBox");
fx.animateProperty( {
    node : node, 
    duration : 750, 
    properties : {
        backgroundColor : {
            start : "yellow"
        }
    }
}).play();

然而，这是有效的：

var node = dom.byId("myTextBox");
fx.animateProperty( {
    node : node.parentNode.parentNode, // grandparent of "myTextBox" 
    duration : 750, 
    properties : {
        backgroundColor : {
            start : "yellow"
        }
    }
}).play();

它应该是这样工作的吗？本页上的示例不需要，但也没有使用TextBox。

附带问题：JQueryUI的highlight效应有更直接的等价物吗？这就是我要做的。

您最好使用dijit.byId("myTextBox")获取对小部件对象的引用。然后，您可以仅参考myTextBox.domNode或myTextBox.focusNode，具体取决于您要突出显示的内容。我不确定您是想突出显示实际的文本输入区域还是背景，但这个简单的jsfiddle演示了两者。您的代码将被更改为类似以下内容：

var textbox = dijit.byId("myTextBox");
fx.animateProperty( {
    node : textbox.focusNode // If you are trying to highlight the input background 
    duration : 750, 
    properties : {
        backgroundColor : {
            start : "yellow"
        }
    }
}).play();
相关文章：