javascript - jquery 用值关联数组替换选择选项

Question

我想根据 select1 中的选择更改 select2 的选项。因此我做了一个这样的关联数组:

var rubrieken = {'1': '<option value="10">Rubriek 10</option><option value="20">Rubriek 20</option>','2': '<option value="30">Rubriek 30</option><option value="40">Rubriek 40</option>'};

因此，如果在 select1 中选择了选项 2，则 select2 的当前值必须替换为具有键 2 的选项。我在下面创建了 Jquery，但是如何从数组中提取选项并将它们放入 select 中？

var rubrieken = {'1': '<option value="10">Rubriek 10</option><option value="20">Rubriek 20</option>','2': '<option value="30">Rubriek 30</option><option value="40">Rubriek 40</option>'};
$( document ).ready(function() {
    //Bij keuze categorie de rubrieken vullen 
    $("#select1").change(function(){
        //maak de huidige select leeg
        $('#select2').empty();
        //selectie uit array van juiste waarden
        $newoptions = "<option>NewO1</option><option>NewO1</option>";
        //vul de select rubriek op basis van categorie keuze    
        $('select#select2').html($newoptions);
    }); 
});

Answer 1

请试试这个!

var rubrieken = {
    '1': '<option value="10">Rubriek 10</option><option value="20">Rubriek 20</option>',
    '2': '<option value="30">Rubriek 30</option><option value="40">Rubriek 40</option>'
};

$(function() {
    $("#select1").change(function() {
        var key = $(this).val();
        var newoptions = rubrieken[key];
        $('#select2').html(newoptions);
    }); 
});

Note:

You won't need $('#select2').empty(); because .html() will replace the content.

祝你好运!