dojo 动画不适用于 xPage 面板

dojo animation doesn't work for xPage panel

我想擦除我的面板。但它不适用于 <xp:panel> 组件,但适用于 <div>。 这是我的代码:

<xp:panel id="myPanel">This is my panel</xp:panel>
.....
dojo.style("myPanel", "height", "");
dojo.style("myPanel", "display", "block");
var wipeArgs = {
        node: "myPanel"
    };
dojo.fx.wipeOut(wipeArgs).play();

这也不行:

dojo.style("#{id:myPanel}", "height", "");
dojo.style("#{id:myPanel}", "display", "block");
var wipeArgs = {
        node: "#{id:myPanel}"
    };
dojo.fx.wipeOut(wipeArgs).play();

但这确实有效:

<div id="myDiv">This is my DIV</div>
.....
dojo.style("myDiv", "height", "");
dojo.style("myDiv", "display", "block");
var wipeArgs = {
        node: "myDiv"
    };
dojo.fx.wipeOut(wipeArgs).play();

那么如何让它适用于 xp:panel?

您需要在 XSP.addOnLoad() 调用中 运行 您的 Dojo 代码,以便 Dojo 使用 XPages 生成的 ID。

<xp:scriptBlock id="scriptBlock1">
    <xp:this.value><![CDATA[
    XSP.addOnLoad(function(){
        dojo.style("#{id:myPanel}", "height", "");
        dojo.style("#{id:myPanel}", "display", "block");
        var wipeArgs = {
                node: "#{id:myPanel}"
            };
        dojo.fx.wipeOut(wipeArgs).play();
    });
]]></xp:this.value>
</xp:scriptBlock>

此外,如果您只想要一个 div 而不是一个附加了数据源的 div,那么您可以使用 xp:div 而不是 xp:panel