0

初めてjQueryUIを使用していますが、問題があります。2 層のメニューを取得しようとしていますが、2 番目の層がレンダリングされません。代わりに、2 番目の層に配置する必要がある項目が最初の層に追加されます。

ここに私のマークアップがあります:

<div id='maps'>
    <h2>Maps</h2>
    <ul id='maps-list'>
    </ul>
</div>

コンテンツは、次の JavaScript 関数を使用して追加されます。

function maps_reload() {

    map_list().done( function( data ) {

        var list = '';
        for( i = 0; i < data.length; i++ ) {
            list += '<li><a href="javascript:map_display_info( ' + data[i].id + ')">' + data[i].name + '</a>';
            list += '<ul>';
            list += '<li><a href="javascript:update_map( ' + data[i].id + ' )">Update Map</a></li>';
            list += '<li><a href="javascript:display_map( ' + data[i].id + ' )">Display Map</a></li>';
            list += '<li><a href="javascript:delete_map( ' + data[i].id + ' )">Delete Map</a></li>';
            list += '</ul></li>';
        }
        list += '<li>&nbsp;</li>';
        list += '<li><a href="javascript:show_add_map()">Add a new map</a></li>';
        $( '#maps-list' ).html( list );
    });

    $( '#maps-list' ).menu();
}

結果の構造は

<ul id='maps-list'>
    <li>
         <a>Map</a>
         <ul>
               <li><a>Update Map</a></li>
               <li><a>Display Map</a></li>
               <li><a>Delete Map</a></li>
         </ul>
    <li>
</ul>

どれが要件を満たしている...だと思いますか？

誰かが私のコードの問題を見ることができますか?

乾杯

4

2 に答える 2

0

このコードが機能しているコードには問題はないと思います。テストする場合は、関数$( '#maps-list' ).menu();の外部で関数を呼び出す必要がありますmaps_reload()。

フィドルをテストするhttp://jsfiddle.net/4LUDz/1/

于 2013-02-04T06:35:10.533 に答える
0

これを機能させるには、各メニュー項目のようにリンクにアンカーを追加する必要があると思います (ただし、メニュー項目ごとにリンクがあることに気づきました)。

例: http://jsfiddle.net/7dw9h/

http://api.jqueryui.com/menu/

<ul id='maps-list'>
    <li>
         <a href="#" >Map</a>
         <ul>
               <li><a href="#">Update Map</a></li>
               <li><a href="#">Display Map</a></li>
               <li><a href="#">Delete Map</a></li>
         </ul>
    <li>
</ul>
于 2013-02-04T06:19:10.490 に答える