首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >以编程方式向现有AccordionContainer添加新的Dojo AccordionPane

以编程方式向现有AccordionContainer添加新的Dojo AccordionPane
EN

Stack Overflow用户
提问于 2010-08-25 11:04:59
回答 2查看 3.8K关注 0票数 2

我正在尝试将一个新的AccordionPane添加到现有的容器中,但就我的生命而言,我无法让它工作。

有没有人能建议我哪里错了?

代码语言:javascript
复制
<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>
EN

回答 2

Stack Overflow用户

发布于 2010-08-25 13:24:56

帮我修好了,谢谢。

代码语言:javascript
复制
        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'));
        } 
票数 2
EN

Stack Overflow用户

发布于 2011-12-15 04:14:24

作为original poster said,要将新的AccordionPane添加到AccordionContainer的顶级中,请使用0表示insertIndex。如果您更愿意将新的AccordionPanel添加到AccordionContainer的底层中,只需从.addChild中删除该insertIndex,如下所示:

代码语言:javascript
复制
        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,其中包含从同一服务器上的另一个页面加载的内容。下面的代码适用于将来发现这一点的任何想要做同样事情的人:

代码语言:javascript
复制
        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'));
        }

此外,如果要在选择子对象时启用动画,请在animate属性中添加true:

代码语言:javascript
复制
            accordion.selectChild(dijit.byId('newpane'), true);
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/3562594

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档