如何使用循环返回javascript数组的某些部分？

时间：2014-07-29 08:47:52

标签： javascript jquery html

我现在已经被困在这一小时一段时间了，只是无法弄清楚D：

更容易理解问题的基本小提琴{@ 3}}

我有两个选择框（select_company和select_profile），基本上当你从select公司中选择一些东西时，启用了选择配置文件框，并允许你从那里选择与选择公司框相关的东西。我创建了一个包含3个假对象的数组，就像它是一个数据库一样。

   var PRIVILEGE_PROFILES = [
{ PROFILE_ID: "ADickinson", COMPANY_CODE: "GW", PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess", "AlAdmin", "DispatchAppAccess"), SECTOR: "01" },
{ PROFILE_ID: "CHague", COMPANY_CODE: "TP", PRIVILEGE_CODE: "DispatchAppAccess", SECTOR: "02" },
{ PROFILE_ID: "JWilliams", COMPANY_CODE: "XC", PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess"), SECTOR: "03" },
];

   var COMPANIES = [
{ Company: "XC" },
{ Company: "TP" },
{ Company: "GW" }

];

COMPANY_CODE表示company_select事物，因此公司代码被加载到company_select框中，例如，如果选择了XC，那么将加载名称＆＃34; JWilliams＆＃34;进入profile_select。我已经设法使用if语句执行此操作，但是我不能使用if语句，因为我会在数组中添加更多内容而我只能做30左右每个公司代码的陈述。要使其工作，带有current_profiles的选择框将加载COMPANIES数组，并且公司必须等于PRIVILEGE_PROFILES数组中的COMPANY_CODE。

  var companyselectHTML = "<select name='select_company' id='select_company'           class='form_drop_down' data-role='none'>" +
      "<option>None</option>";


var profileselectHTML = "<select name='select_profile' id='select_profile' class='form_drop_down' data-role='none'>" +
"<option>None</option>";


for (var p = 0; p < COMPANIES.length; p++) {
    companyselectHTML += "<option value='" + COMPANIES[p].Company + "'>" + COMPANIES[p].Company + "</option>";
}

这是我的选择框的生成方式以及将权限加载到其中的基本循环。 然而，这是我陷入困境的地方，我不明白如何让循环工作。我有一个来自这里的用户帮助我，它确实将PROFILE_ID加载到选择框中，但只有IF语句，我不能做30 if语句。必须有一个更简单的方法吗？

   $(document).on('change', '#select_company', function () {
          if ($(this).val() == "GW") $('#select_profile').append("<option value='" + PRIVILEGE_PROFILES[0].PROFILE_ID + "'>" + PRIVILEGE_PROFILES[0].PROFILE_ID + "</option>")

    $('#select_profile option[value="ADickinson"]').remove();
});

所以我尝试使用某种循环，但没有运气。它没有返回任何东西，它可能是错的我不是一个非常好的编码器。如果有人能帮助我，你就是一个绝对的上帝。

     var Select = document.getElementById("select_company").value;

   $(document).on('change', '#select_company', function () {
        for (var i = 0; i < PRIVILEGE_PROFILES.length; i++) {
            if (PRIVILEGE_PROFILES[i].COMPANY_CODE == Select) {
            $('#select_profile').append("<option value='" + PRIVILEGE_PROFILES[i].PROFILE_ID +      "'>" + PRIVILEGE_PROFILES[i].PROFILE_ID + "</option>");
           }

            else {
            $('#select_profile option').remove();
        }
    }

});

因此，如果这绝对没有意义，我会写一点摘要。 用户从company_select选择框中选择公司 然后，任何等于所选COMPANY的COMPANY_CODE将显示在select_profile复选框中 我真的不能使用IF语句，因为我计划在数组中添加更多内容。如果我想出来的话。

2 个答案:

答案 0 :(得分：1)

也许这就是你要找的东西？

演示：http://jsfiddle.net/robschmuecker/SWUeA/7/ 

$(document).ready(function () {


    var COMPANIES = [{
        Company: "XC"
    }, {
        Company: "TP"
    }, {
        Company: "GW"
    }

    ];
    var PRIVILEGE_PROFILES = [{
        PROFILE_ID: "ADickinson",
        COMPANY_CODE: "GW",
        PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess", "AlAdmin", "DispatchAppAccess"),
        SECTOR: "01"
    }, {
        PROFILE_ID: "CHague",
        COMPANY_CODE: "TP",
        PRIVILEGE_CODE: "DispatchAppAccess",
        SECTOR: "02"
    }, {
        PROFILE_ID: "JWilliams",
        COMPANY_CODE: "XC",
        PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess"),
        SECTOR: "03"
    }, ];



    var companyselectHTML = "<select name='select_company' id='select_company' class='form_drop_down' data-role='none'>" +
        "<option>None</option>";

    var profileselectHTML = "<select name='select_profile' id='select_profile' class='form_drop_down' data-role='none'>" +
        "<option>None</option>";


    for (var p = 0; p < COMPANIES.length; p++) {
        companyselectHTML += "<option value='" + COMPANIES[p].Company + "'>" + COMPANIES[p].Company + "</option>";
    }
    companyselectHTML += "</select>";
    $("#company_selection").html(companyselectHTML);



    for (var p = 0; p < PRIVILEGE_PROFILES.length; p++) {
        profileselectHTML += "<option value='" + PRIVILEGE_PROFILES[p].PROFILE_ID + "'>" + PRIVILEGE_PROFILES[p].PROFILE_ID + "</option>";
    }
    profileselectHTML += "</select>";
    $("#profile_selection").html(profileselectHTML);


    $(document).on('change', '#select_company', function () {
        var val = $(this).val();
        console.log(val);
        for (var i = 0; i < PRIVILEGE_PROFILES.length; i++) {
            if (PRIVILEGE_PROFILES[i].COMPANY_CODE == val) {
                $('#select_profile').val(PRIVILEGE_PROFILES[i].PROFILE_ID);
            }
            /* else {
            $('#select_profile option').remove();
        }*/
        }

    });

});

答案 1 :(得分：1)

代码中的几个问题：

  1. 您在加载页面时设置Select，而不是在用户从公司选择菜单中选择内容时设置。{/ p>

  2. 当循环在PRIVILEGE_PROFILES中找到不匹配的值时，您的循环正在从“配置文件选择”菜单中删除所有选项。相反，您应该在循环之前清空菜单，然后在循环期间使用匹配的值填充它。

  3. PRIVILEGE_PROFILES变量是formatAppSelect函数的本地变量，因此无法从change事件处理程序访问。它需要在两个函数之外的范围内。

    4. 工作代码（FIDDLE）

    var PRIVILEGE_PROFILES = [{
    PROFILE_ID: "ADickinson",
    COMPANY_CODE: "GW",
    PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess", "AlAdmin", "DispatchAppAccess"),
    SECTOR: "01"
}, {
    PROFILE_ID: "CHague",
    COMPANY_CODE: "TP",
    PRIVILEGE_CODE: "DispatchAppAccess",
    SECTOR: "02"
}, {
    PROFILE_ID: "JWilliams",
    COMPANY_CODE: "XC",
    PRIVILEGE_CODE: ("AlAccess", "AlBlockAccess"),
    SECTOR: "03"
}, ];

formatAppSelect();

function formatAppSelect() {

    var COMPANIES = [{
        Company: "XC"
    }, {
        Company: "TP"
    }, {
        Company: "GW"
    }

    ];

    var companyselectHTML = "<select name='select_company' id='select_company' class='form_drop_down' data-role='none'>" +
        "<option>None</option>";

    var profileselectHTML = "<select name='select_profile' id='select_profile' class='form_drop_down' data-role='none'>" +
        "<option>None</option>";

    for (var p = 0; p < COMPANIES.length; p++) {
        companyselectHTML += "<option value='" + COMPANIES[p].Company + "'>" + COMPANIES[p].Company + "</option>";
    }

    profileselectHTML += "</select>";
    $("#profile_selection").html(profileselectHTML);

    companyselectHTML += "</select>";
    $("#company_selection").html(companyselectHTML);

}

$(document).on('change', '#select_company', function () {
    var Select = $(this).val();
    $("#select_profile").empty().append("<option>None</option>");
    for (var i = 0; i < PRIVILEGE_PROFILES.length; i++) {
        if (PRIVILEGE_PROFILES[i].COMPANY_CODE == Select) {
            $('#select_profile').append("<option value='" + PRIVILEGE_PROFILES[i].PROFILE_ID + "'>" + PRIVILEGE_PROFILES[i].PROFILE_ID + "</option>");
            break;
        }
    }

});
相关问题
最新问题