Question

我有几个下拉菜单，一旦被选中，应该根据用户的选择返回不同类型的数据。这是格式：

var data = {
        name :{
                first:{
                    itemOne    : [],
                    itemTwo    : [],
                    itemThree  : []
                }

                second:{
                    itemOne    : [],
                    itemTwo    : [],
                    itemThree  : []
                }

                third:{
                    itemOne    : [],
                    itemTwo    : [],
                    itemThree  : []
                }
        }
 }

所以有两个下拉菜单。第一个菜单的名称为“第一个＆＃39;”，“第二个＆＃39;”，“第三个＆＃39;第二个菜单包含＆＃39; itemOne＆＃39;，＆＃39; itemTwo＆＃39;和＆＃39; itemThree＆＃39;。因此，每当用户从这两个下拉菜单中进行选择时，我希望返回或更新数据。我目前只有一个菜单有以下内容：

 $('#selectMenu').on('change', function (event) {

        var selectedData = data[$(this).val()];
        console.log(selectedData);

        });

我怎样才能做到这一点，以便返回的数据取决于下拉菜单而不仅仅是一个？

编辑：HTML标记

<span display: inline-block; width: 150px>
  <center>
    <select id="selectMenuTwo"> 
        <option value="first">first</option>
        <option value="second">second</option>
        <option value="third">third</option>
    </select>

    <select id="selectMenu">
        <option>Menu 1</option>
        <option value="itemOne">Item One</option>
        <option value="itemTwo">Item Two</option>
        <option value="itemThree">Item Three</option>
    </select>
 </center>
</span>

Answer 1

您可以在两个下拉列表中处理更改事件，然后只需查看其他菜单中所选的值＆＃34;更改＆＃34;功能

    $('#selectMenu1').on('change', function (event) {

        var menu2SelectedData = $('#selectMenu2').val();
        var selectedData = data[$(this).val()];
        console.log(selectedData);

    });

    $('#selectMenu2').on('change', function (event) {

        var menu1SelectedData = $('#selectMenu1').val();
        var selectedData = data[$(this).val()];
        console.log(selectedData);

    });

或者这样的事情会更清洁......

    // handle change for both menues
    $('#selectMenu1, #selectMenu2').on('change', function (event) {

        var menu1SelectedData = $('#selectMenu1').val();
        var menu2SelectedData = $('#selectMenu2').val();
        var dataForDropdown = data.name[menu1SelectedData][menu2SelectedData];

    });

根据多个下拉菜单返回数据

1 个答案: