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
。
我想擦除我的面板。但它不适用于 <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
。