Javascript 具体化选择不工作的附加选项

我在我的项目中使用了物化css，当我想用ajax在materialize select中添加选项时，我遇到了问题。我一直在跟踪这个答案。但不起作用

在我的html中，我使用materialize模式来呈现materialize表单。这是我的代码：

                   <div class="input-field col s12">                            
                        <select id="select_1" name="select_1">
                            <option value="1">option 1</option>
                            <option value="2">option 2Barat</option>     
                        </select>
                      <label for="select_1">Select 1</label>
                    </div>

                     <div class="input-field col s12">                          
                        <select id="select_2"  name="select_2">
                            <option value="0" disabled="disabled">Choose option</option>
                        </select>
                      <label for="select_2">Select 2</label>
                    </div>

选择1
备选方案2巴拉特
选择1
选择选项
选择2

我的js

<script type="text/javascript">
    $(document).ready(function(){
        function get_selected(){
            var base_url = '<?php echo base_url() ?>';
            var data = $('#select_1').val();
            $.ajax({
                url: ""+base_url+"admin/get_data/",
                dataType: 'json',
                type: "POST",
                data:{'data':data},
                beforeSend: function() {

                },                  
                success: function (data) {
                    var text = '';
                    var $selectDropdown = $("#select_1").empty().html(' ');

                    $.each(data, function(i, val){                      
                        $selectDropdown.append($("<option></option>").attr("value",val.id).text(val.name));

                    })

                    $selectDropdown.trigger('contentChanged');
                    $('select').on('contentChanged', function() {
                      // re-initialize (update)
                      $(this).material_select();
                    });
                },
                error: function (xhr, status, err) {
                    // console.log(xhr);
                    // console.log(status);
                    // console.log(err);
                },
            });
        }


        $(document).on('change','#select_1', function(){
            get_selected();         
        })
    })
</script>

$（文档）.ready（函数（）{
函数get_selected（）{
var base_url=''；
变量数据=$（'#选择1'）.val（）；
$.ajax({
url:“+base\u url+”管理员/get\u数据/”，
数据类型：“json”，
类型：“POST”，
数据：{'data'：数据}，
beforeSend:function（）{
},                  
成功：功能（数据）{
var text=''；
var$selectDropdown=$（“#select_1”）.empty（）.html（“”）；
$.each（数据，函数（i，val）{
$selectDropdown.append（$（“”）.attr（“value”，val.id）.text（val.name））；
})
$selectDropdown.trigger（'contentChanged'）；
$（'select'）。在（'contentChanged'，function（）上{
//重新初始化（更新）
$（此）.material_select（）；
});
},
错误：函数（xhr、状态、错误）{
//console.log（xhr）；
//控制台日志（状态）；
//控制台日志（err）；
},
});
}
$（文档）。在（'更改'，'选择1'，函数（）上{
将_选中（）；
})
})

注意：我使用jQuery3.3.1和MaterializeVersion0.100.2。谢谢你的帮助，对不起我的英语：）

$（文档）.ready（函数（）{
$（'select'）。材料选择（）；
});
$（文档）。在（'更改'，'选择1'，函数（）上{
将_选中（）；
})
函数get_selected（）{
var data=[{id:1，名称：“ABC”}，{id:2，名称：“XYZ”}，{id:3，名称：“PQR”}]；
var期权=”；
$.each（数据，函数（i，val）{
选项=选项+“”+val.name+“”；
});
$（“#选择_2”）.empty（）；
$（'#选择_2'）。附加（选项）；
$（“选择2”）。材料选择（）
}

选择1
备选方案2巴拉特
选择1
选择选项
选择2

对于2019年之后来到这里的任何人，请注意，API已更改，材质选择（）不再有效。 使用

$（“#我的_元素”）.append（）
$（“#我的_元素”）.formSelect（）

谢谢你的努力：D你有这方面的背景吗？我们为什么要使用formSelect（），它在做什么？这不是答案

    $('#my_Element').append(<Array of options>)
    $('#my_Element').formSelect()