以编程方式将新Dojo AccordionPane添加到现有AccordionContainer
我正试图将一个新的AccordionPane添加到一个现有的容器中,但就我而言,我无法让它工作 有人能告诉我哪里出了问题吗以编程方式将新Dojo AccordionPane添加到现有AccordionContainer,dojo,accordion,Dojo,Accordion,我正试图将一个新的AccordionPane添加到一个现有的容器中,但就我而言,我无法让它工作 有人能告诉我哪里出了问题吗 <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" djConfig="parseOnLoad: true"> </script>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" djConfig="parseOnLoad: true"> </script>
<script type="text/javascript">
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.AccordionContainer");
</script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.4.0/dijit/themes/tundra/tundra.css">
<script type="text/javascript">
function AddNewPane() {
var accordPane = new dijit.layout.AccordionPane({"title": "test", "content":"hello"});
dijit.layout.AccordionContainer("myacc").addChild(accordPane);
accordPane.startup();
//select the new Pane
accordPane.selected = true;
}
</script>
</head>
<body>
<button type="button" onclick="AddNewPane();" >Add</button>
<div dojoType="dijit.layout.AccordionContainer" id="myacc" class="tundra" >
<div dojoType="dijit.layout.AccordionPane" title="Origional Acc 1" >
Testing One
</div>
<div dojoType="dijit.layout.AccordionPane" title="Origional Acc 2" >
Testing Two
</div>
</div>
<script>
document.getElementById("myacc").style.width = '200px';
document.getElementById("myacc").style.height = '200px';
</script>
</body>
</html>
require(“dijit.layout.ContentPane”);
require(“dijit.layout.AccordionContainer”);
函数AddNewPane(){
var accordPane=new dijit.layout.AccordionPane({“title”:“test”,“content”:“hello”});
dijit.layout.accordioncainer(“myacc”).addChild(accordiopane);
启动();
//选择新窗格
accordPane.selected=true;
}
添加
测试一
测试二
document.getElementById(“myacc”).style.width='200px';
document.getElementById(“myacc”).style.height='200px';
成功了,谢谢
function Testing() {
var accordion = dijit.byId("myacc");
var d = new dijit.layout.AccordionPane({id:'newpane', title:'hello', content: 'testing'});
accordion.addChild(d, 0);
dijit.byId('myacc').selectChild(dijit.byId('newpane'));
}
作为示例,要将新的AccordionPane添加到AccordionContainer的顶部,请使用0作为insertIndex。
如果您希望将新的AccordionPanel添加到AccordionContainer的底部,只需从.addChild中删除insertIndex,如下所示:
function Testing() {
var accordion = dijit.byId("myacc");
var d = new dijit.layout.AccordionPane({id:'newpane', title:'hello', content: 'testing'});
accordion.addChild(d);
accordion.selectChild(dijit.byId('newpane'));
}
另外,在我的例子中,我想向AccordionContainer添加一个新的AccordionPane,其中包含从同一服务器上的另一个页面加载的内容。以下代码适用于将来发现此问题并希望进行相同操作的任何人:
function Testing() {
var accordion = dijit.byId("myacc");
var d = new dijit.layout.AccordionPane({id:'newpane', title:'hello', href: "location/of/page.php", preload: true});
accordion.addChild(d);
accordion.selectChild(dijit.byId('newpane'));
}
此外,如果要在选择子对象时启用动画,请将“真”添加到“动画”属性:
accordion.selectChild(dijit.byId('newpane'), true);