解决Modal内Select2搜索失效配置dropdownParent后，点击选项触发Modal自动关闭

偶发Modal自动关闭的核心冲突，来自Select2与Bootstrap Modal的事件逻辑不兼容：
当你将Select2的dropdownParent设为Modal容器后，Select2的下拉面板会渲染为Modal的子节点。Bootstrap Modal默认会监听全局点击事件，当判定点击目标不在Modal交互范围内时就会触发关闭；偶发的DOM渲染偏移、焦点转移时机错位，会让Modal的判定逻辑误把对Select2下拉选项的点击识别为“外部点击”，进而触发异常关闭。

• 统一全Modal内的Select2配置，避免单组件零散配置导致的渲染差异：
  给所有嵌入Modal的Select2绑定统一类名（比如.modal-select），集中初始化配置，不要零散给单个ID赋值：

  $('#my-modal .modal-select').select2({
    dropdownParent: $('#my-modal'),
    selectOnClose: false,
    // 减少Select2自动挂载文档层的默认行为，降低事件冲突概率
    containerCssClass: 'select2-in-modal'
  });
  

• 增加事件阻断逻辑，避免Select2内部的点击事件冒泡触发Modal的关闭判定：

// 监听Select2搜索框、下拉选项的点击事件，阻断向上冒泡的路径
$('#my-modal').on('click', '.select2-search__field, .select2-results__option', function(e) {
  e.stopPropagation();
});

• 排除其他可能的触发源：
  给Modal的DOM节点加上data-bs-keyboard="false"，先排除用户选择选项时误触ESC键触发的关闭；同时检查Modal的自定义点击关闭逻辑，避免Select2的下拉层被误判定为可触发关闭的“空白区域”。

内容的提问来源于stack exchange，提问作者Kinyua James