0

GWTQueryとGWTQuery-UIを使用していますが、JQuery-UIでも同じように機能すると思います。

HTMLドキュメントでアコーディオンを定義せずにアコーディオンを作成するにはどうすればよいですか？

例えば

    $("<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に追加します-パネルは機能しています。

4

2 に答える 2

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>
于 2012-04-09T15:38:04.157 に答える
0

accordion()新しいjQueryオブジェクトを変数に設定すると、次のようにそのオブジェクトのメソッドを呼び出すことができます。

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を介してアクセスできる要素に依存する関数が存在する可能性があるため、テストしていないため、これはまだ機能しない可能性があります。

しかし、見えない要素にアコーディオンを作成するのに時間を費やすポイントが見当たらないので、このポイントは私には失われますか？

于 2012-04-09T15:38:01.863 に答える