如何在forloop(laravel)中使用javascript和ajax中的许多动态下拉列表？

@for($i = 1; $i <= 5; $i++)
    <select class="dynamic-dropdown" id="dropdown{{$i}}">
        <option value="">请选择</option>
    </select>
@endfor

$(document).ready(function() {
    // 绑定每个下拉列表的change事件
    $('.dynamic-dropdown').change(function() {
        var dropdownId = $(this).attr('id'); // 获取当前下拉列表的ID
        var selectedValue = $(this).val(); // 获取当前选中的值

        // 发起Ajax请求，获取下一个下拉列表的选项
        $.ajax({
            url: '/get-dropdown-options', // 替换为你的后端路由地址
            type: 'POST',
            data: {
                dropdownId: dropdownId,
                selectedValue: selectedValue
            },
            success: function(response) {
                // 清空下一个下拉列表的选项
                $('#' + response.dropdownId).empty();

                // 添加新的选项到下一个下拉列表
                $.each(response.options, function(key, value) {
                    $('#' + response.dropdownId).append('<option value="' + key + '">' + value + '</option>');
                });
            }
        });
    });
});

Route::post('/get-dropdown-options', 'DropdownController@getOptions');

public function getOptions(Request $request)
{
    $dropdownId = $request->input('dropdownId');
    $selectedValue = $request->input('selectedValue');

    // 根据当前选中的值，获取下一个下拉列表的选项
    $options = $this->getOptionsForDropdown($dropdownId, $selectedValue);

    return response()->json([
        'dropdownId' => $nextDropdownId,
        'options' => $options
    ]);
}

private function getOptionsForDropdown($dropdownId, $selectedValue)
{
    // 根据需要的逻辑，获取下一个下拉列表的选项
    // 返回一个关联数组，键为选项的值，值为选项的显示文本
}