0

您好,我正在尝试在菜单栏中制作一个带有 2 个下拉菜单的 JQM Webapp,例如 -

菜单 1 页面标题 SubMenu 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

如果为第二个菜单设置一组值,则可以在每次更改第一个菜单时动态“重置”第二个菜单:

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​

这将第一个菜单中所选选项的值与第二个菜单中的内容相关联。

这是一个演示:http: //jsfiddle.net/aVkgp/199/

于 2012-12-03T21:12:50.803 回答