《ElementPlus 与 ElementUI 差异集合》el-select 显示下拉列表在 Cesium 场景中无法监听关闭

前言

仅在 Element UI 时有此问题,Element Plus 由于内部结构差异较大,不存在此问题。详见《el-select 差异点,如:高、宽、body插入等》

问题

  • 点击空白处,下拉列表可监听并关闭;
  • 但在 Cesium 中无法监听和关闭;

解决方案

  • 代码 2 行,初始化时监听 body 单击事件;
  • 代码 7 行,获取全局下拉列表;
  • 代码 11 - 14 行,仅当列表显示时,触发 click 事件;
javascript 复制代码
// 初始化时监听 body 单击事件
document.getElementsByTagName('body')[0].onclick = () => {
    // 获取 el-select
    const els = document.querySelectorAll('.el-select');
    els.forEach(el => {
        // 获取全局下拉列表
        const dropdownEls = el.querySelectorAll('.el-select-dropdown');
        for (let i = 0; i < dropdownEls.length; i++) {
            const dEl = dropdownEls[i];
            // 仅对打开的起作用
            if (dEl.style.display !== 'none') {
                el.click();
                break;
            }
        }
    })
};
相关推荐
粥里有勺糖18 分钟前
视野修炼-技术周刊第130期 | 光影效果
前端·javascript·github
小岛前端33 分钟前
AI Skills 已经封神,但新的问题却越来越严重!
前端·后端·github
拖孩36 分钟前
一个人 + AI 做的小程序,上线 15 天赚了 10 块 5
前端·后端·微信小程序
用户939838294159937 分钟前
安卓自动化脚本热更新怎么做?不重新打包 APK 也能更新代码
前端
猫七先生1 小时前
在 React 里用 PMTiles 自托管底图
前端
tanghonghanhaoli1 小时前
【图书翻译】有意义的游戏设计:桌面游戏的方法论与心理学(第1、2章)
前端·游戏·ui
光影少年1 小时前
react native打包优化、包体积瘦身、离线包/热更新方案
前端·react native·react.js
Cache技术分享1 小时前
504. Java 反射 - 创建一个简单的依赖注入框架
前端·后端
_codeOH1 小时前
# 手把手复刻 DeepSeek 官网效果:玻璃拟态 + WebGL 流体 + Spring 动画,一篇讲透
前端
名字还没想好☜1 小时前
Next.js 用 cookies()/headers() 读请求信息:动态渲染触发、缓存失效与在 Server Action 里读写 cookie
前端·javascript·缓存·react·next.js·app router