Question

我正在使用GWTQuery和GWTQuery-UI，但我认为它对JQuery-UI也是一样的。

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

e.g。

    $("<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();

这根本不会显示任何文字。如果我将它附加到Panel，我只能获得带有该部分的文本但不能获得手风琴。

由于

编辑：在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-panel正在运行。

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访问的元素，因此我可能仍然无法正常工作，因为我还没有测试过。

然而，这一点在我身上失去了，因为我没有看到花时间在一个无法看到的元素上创造手风琴的重点？

jQuery手风琴来自$（“div id = \”accordion \“＆gt;

2 个答案: