Jquery Chained结合Select2多选时联动仅取首选项，是否支持多选场景？

Jquery Chained 2.x版本原生不支持父级下拉为多选的联动场景，其内部逻辑默认仅读取父级选择器的首个选中值作为子级选项的筛选依据，这就是你遇到的子级联动始终只匹配第一个选中父选项对应内容的根本原因。

你可以直接手动编写联动逻辑替代原有chained方法，不需要额外引入其他依赖，适配步骤如下：

1. 先删除原有chained初始化代码：

// 删掉原有代码中的这一行
$("#zone_id").chained("#governorate_id");

2. 新增自定义多选联动逻辑：

// 监听父级Governorate下拉的选中变化事件
$('#governorate_id').on('change', function() {
    // 获取所有已选中的父级ID数组，未选中时默认赋值为空数组
    const selectedGovIds = $(this).val() || [];
    
    // 遍历子级Zone的所有option处理显示/隐藏状态
    $('#zone_id option').each(function() {
        const $opt = $(this);
        // 保留默认空选项
        if ($opt.val() === '') {
            $opt.show();
            return;
        }
        // 读取当前Zone选项绑定的关联Governorate ID
        const bindGovId = $opt.data('chained').toString();
        
        // 关联ID在已选中父级ID列表中则显示，否则隐藏
        if (selectedGovIds.includes(bindGovId)) {
            $opt.show();
        } else {
            // 隐藏前先取消该选项的选中状态，避免提交无效数据
            if ($opt.is(':selected')) {
                $opt.prop('selected', false);
            }
            $opt.hide();
        }
    });
    // 触发Select2组件更新，渲染最新的选项列表
    $('#zone_id').trigger('change');
});

内容的提问来源于stack exchange，提问作者Ahmed Abobakr