0

こんにちは、メニューバーに2つのドロップダウンがあるJQM Webappを作成しようとしています-

メニュー 1 ページのタイトル サブメニュー 1

Menu1 には 5 つのメイン オプションがあり、Menu2 には 5 つのサブ オプションがあります。

ユーザーが [First Menu ] からオプションを選択した場合のように、5 つのオプションが Submenu1 に表示され、各サブメニューの HTML ページが表示されます。【全部で25ページになります】

Menu1 --Submenu1 -- 新しいページ [menu1-submenu1.html]

Menu1 --Submenu2 -- 新しいページ [menu1-submenu2.html]

Menu1 --Submenu3 -- 新しいページ [menu1-submenu3.html]

Menu1 --Submenu4 -- 新しいページ [menu1-submenu4.html]

Menu1 --Submenu5 --- 新しいページ[menu1-submenu5.html]

Menu2 --Submenu1 - -- 新しいページ [menu2-submenu1.html]

Menu2 --Submenu2 -- 新しいページ [menu2-submenu2.html]

Menu2 --Submenu3 -- 新しいページ [menu2-submenu3.html]

...................................................

これに対してイベント処理を行うにはどうすればよいですか?

私が持っている次のコードは、私のタスクの基本的な GUI を提供します-http://jsfiddle.net/aVkgp/198/

4

1 に答える 1

0

2 番目のメニューに値の配列を設定すると、最初のメニューが変更されるたびに 2 番目のメニューを動的に「リセット」できます。

var secondMenu = [
        '<option value="1-1">1</option><option value="1-2">3</option><option value="1-3">3</option>',
        '<option value="2-1">1</option><option value="2-2">3</option><option value="2-3">3</option>',
        '<option value="3-1">1</option><option value="3-2">3</option><option value="3-3">3</option>'
    ];
$('#select-choice-1').on("change", function(e){
    $("#select-choice-2").html(secondMenu[$(this).val()]).selectmenu('refresh');
}).trigger('change');//initialize for first-load​

これにより、最初のメニューで選択されたオプションの値が、2 番目のメニューの内容に関連付けられます。

ここにデモがあります: http://jsfiddle.net/aVkgp/199/

于 2012-12-03T21:12:50.803 に答える