jQuery Accordion from $("div id=\"ativeion\">

Question

我正在使用GWTQuery和GWTQuery-UI，但我认为它对JQuery-UI的工作方式相同。

如何在不定义手风琴的情况下创建手风琴？

例如

    $("<div id="accordion">   <h3><a href="#">Section 1</a></h3><div><p>Mauris.</p></div><h3><a href="#">Section 2</a></h3><div><p>Sed non urna.</p></div><h3><a href="#">Section 3</a></h3><div><p>Nam enim risus.</p><ul><li>List item one</li><li>List item two</li>li>List item three</li></ul></div><h3><a href="#">Section 4</a></h3><div><p>Cras dictum.</p><p>Suspendisse</p></div></div>");
    $("#accordion").as(Ui).accordion();

这根本不会显示任何文本。如果我将其附加到面板，我只会得到带有该部分的文本，但没有手风琴。

谢谢

编辑：在HTML文件中创建一个空的div手风琴，附加字符串

$("#accordion")
            .append("<h3><a href="#">Section 1</a></h3><div><p>Section 1 text here.</p></div>");
    $("#accordion")
            .append("<h3><a href="#">Section 2</a></h3><div><p>Section 2 text here.</p></div>");
    $(absolutePanel_1.getElement()).append(
            $("#accordion").as(Ui).accordion());

并将其添加到 GWT 面板正在工作。

Answer 1

您可以在 JavaScript 中创建手风琴，但需要将其附加到元素中才能在页面上显示。

请参阅此 jsFiddle 进行演示。代码如下：

<script type="text/javascript">
    $(function(){
        //get the accordion container
        var $accordion = $("#accordion");    
        //append elements to the accordion   
        $accordion.append("<h3><a href="#">Section 1</a></h3><div><p>Section 1 text here.</p></div>");
        $accordion.append("<h3><a href="#">Section 2</a></h3><div><p>Section 2 text here.</p></div>");
        //turn it into an accordion
        $accordion.accordion();          
    });
</script>
<div id="accordion"></div>

Answer 2

如果你将新的jQuery对象设置为一个变量，你将能够对其调用accordion()方法，如下所示：

var $div = $("<div id="accordion"><h3><a href="#">Section 1</a></h3><div><p>Mauris.</p></div><h3><a href="#">Section 2</a></h3><div><p>Sed non urna.</p></div><h3><a href="#">Section 3</a></h3><div><p>Nam enim risus.</p><ul><li>List item one</li><li>List item two</li>li>List item three</li></ul></div><h3><a href="#">Section 4</a></h3><div><p>Cras dictum.</p><p>Suspendisse</p></div></div>");
$div.accordion();

但是，accordion()可能使用某些函数依赖于通过DOM访问的元素，因此这可能仍然不起作用，因为我尚未对其进行测试。

然而，这对我来说是没有意义的，因为我不明白花时间在一个看不见的元素上创作手风琴的意义？