为动态选择框选择更新功能

我创建了一个脚本，该脚本根据上一个选择框中选择的内容填充选择框的内容。脚本本身运行良好，但我还有一个问题。

当我在选择框 2 中选择某些内容时，选择框 3 充满了内容。然而，问题是当我决定再次更改 selectbox2 时，我无法选择 slectbox3 的第一个选项。

所以让我们说：

选择框 1（非动态）：- 苹果（部分）- 三星- 华为

选择框2（动态内容）：- 平板电脑- 苹果手机（已选择）- iPod

选择框3（动态内容）：- 苹果手机3- 苹果手机4- 苹果手机5（部分）

所以现在我在选择框3中。当我决定将 Selectbox1 或 Selectbox2 更改为其他内容时，选择框不会更新为新选择的选项。

我已经读过一些关于这个的东西，我认为它与trigger('update')函数有关。

我试过这个：

var $select = $('#id-from-selectbox');，然后使用以下命令更新选择框： $select.trigger('update')

你可以在这里看到脚本的运行情况 ->在这里（在"wat zoekt u？"下）

我真的完全被困在这个上面了。任何帮助，欢迎！

所以我的 HTML：

<form action="" method="post" name="compatible">
    <div class="zoeken-select">
        <div id="optieEen" class="zoeken-value">Selecteer een merk</div>
        <div class="zoeken-handle"></div>
        <select id="changeEen" name="changeEen" class="gui-validate selector">
            <option value="" disabled="" selected="">Selecteer een merk</option>
            <option id="1782331" value="1782331">Apple</option>
            <option id="1782359" value="1782359">BlackBerry</option>
            <option id="1782401" value="1782401">HTC</option>
            <option id="1782485" value="1782485">Huawei</option>
            <option id="1782509" value="1782509">LG</option>
            <option id="1782577" value="1782577">Motorola</option>
            <option id="1782587" value="1782587">Nokia</option>
            <option id="1782735" value="1782735">Samsung</option>
            <option id="1782889" value="1782889">Sony Ericsson</option>
            <option id="1782937" value="1782937">Sony</option>
        </select>
    </div>
    <div class="zoeken-select">
        <div id="optieTwee" class="zoeken-value">Selecteer een serie</div>
        <div class="zoeken-handle"></div>
        <select class="gui-validate selector" name="changeTwee" id="changeTwee">
            <option selected="" disabled="" value="">Selecteer een serie</option>
        </select>
    </div>
    <div class="zoeken-select">
        <div id="optieDrie" class="zoeken-value">Selecteer een model</div>
        <div class="zoeken-handle"></div>
        <select class="gui-validate selector" name="changeDrie" id="changeDrie">
            <option selected="" disabled="" value="">Selecteer een model</option>
        </select>
    </div>
    <div class="zoeken-select">
        <div id="optieVier" class="zoeken-value">Selecteer een onderdeel</div>
        <div class="zoeken-handle"></div>
        <select class="gui-validate selector" name="changeVier" id="changeVier">
            <option selected="" disabled="" value="">Selecteer een onderdeel</option>
        </select>
    </div> <a title="Inloggen" href="#" onclick="go_category();" class="zoekbtn btn btn-custom">Search</a>
</form>
var categoryUrl = '';
$('#selector-widget .selector').change(function () {
    var selectVal = $(this).val();
    var selectName = $(this).attr('name');
    $.getJSON('link-to-json?format=json', function(data){
            $.each(data.shop.categories, function(i, category) {
              var mainCatId = category.id;
              if(selectName == 'changeEen') {
                $("#optieEen").html($("#changeEen option:selected").text());
                if(category.id == selectVal) {
                  categoryUrl = category.url;
                  $('#changeTwee .cat-new').remove();
                  if(category.subs) {
                    var $select = $('#changeTwee');
                    $.each(category.subs, function(i, category) {
                      $('#changeTwee').append('<option class="cat-new" value="'+category.id+'">'+category.title+'</option>');
                    });
                    $select.trigger('update');
                  }
                }
              } else {
                if(category.subs) {
                  $.each(category.subs, function(i, category) {
                    if(selectName == 'changeTwee') {
                      $("#optieTwee").html($("#changeTwee option:selected").text());
                      if(category.id == selectVal) {
                        categoryUrl = category.url;
                        $('#changeDrie .cat-new').remove();
                        if(category.subs) {
                          var $select = $('#changeDrie');
                          $.each(category.subs, function(i, category) {
                            $('#changeDrie').append('<option class="cat-new" value="'+category.id+'">'+category.title+'</option>');
                          });
                          $select.trigger('update');
                        }
                      }
                    } else {
                      if(category.subs) {
                        $.each(category.subs, function(i, category) {
                          if(selectName == 'changeDrie') {
                            $("#optieDrie").html($("#changeDrie option:selected").text());
                            if(category.id == selectVal) {
                              categoryUrl = category.url;
                              $('#changeVier .cat-new').remove();
                              $.getJSON(categoryUrl+'/?format=json', function(data) {
                                var $select = $('#changeVier');
                                $.each(data.collection.filters.custom, function(index, filter) {
                                  if(filter.id == '9041') {
                                    $.each(filter.values, function(index, value) {
                                      $('#changeVier').append('<option class="cat-new" value="'+value.id+'">'+value.title+'</option>');
                                    });
                                  }
                                });
                                $select.trigger('update');
                              });                                     
                            }
                          } else {
                            if(selectName == 'changeVier'){
                              $("#optieVier").html($("#changeVier option:selected").text());
                              if(category.subs) {
                                $.each(category.subs, function(i, category) {
                                  $('#changeVier').append('<option class="cat-new" value="'+category.id+'">'+category.title+'</option>');
                                });
                              }
                            }
                          }
                        });
                      }
                    }
                  });
                }
              }        
            });  
          });
});
function go_category() {
    if ($("select#changeVier").val() != '') {
        categoryUrl = categoryUrl + '/?filter[]=' + $("select#changeVier option:selected").val();
    } else {
        categoryUrl = categoryUrl;
    }
    window.location = categoryUrl;
}

$select.trigger('update');

$select.val(null).trigger('change')