input[type="date"]点击无反应的四大主因：1.元素被设readonly/disabled；2.CSS禁用交互或遮挡图标；3.HTML lang缺失或元素不可见；4弹窗中z-index不足或框架自动加readonly。
为什么 input[type="date"] 点击没反应？先查这四点
不是代码写错了，而是浏览器或环境直接禁用了原生交互。常见真因有四个，缺一不可：
-
input被设了readonly或disabled属性（哪怕 JS 动态加的，哪怕只存在 1ms） - CSS 中写了
-webkit-appearance: none、pointer-events: none，或覆盖了右侧小图标区域 -
缺失——iOS Safari 依赖这个判断是否启用系统级日历 - 元素处于不可见状态：父容器
display: none、visibility: hidden、overflow: hidden且高度不足
弹窗/抽屉里 el-date-picker 或原生 input[type="date"] 不弹出？重点看 z-index 和 readonly
在 <el-dialog></el-dialog>、<el-drawer></el-drawer> 或自定义 modal 中，日期控件失效最常因两个隐藏条件被破坏：
- 弹窗内容渲染时，
input元素被框架自动加上readonly（尤其 Vue 组件初始化瞬间）；解决方法是监听@focus，用$nextTick移除该属性 - 弹层遮罩的
z-index值太低，导致原生日历面板被压在下面；必须确保弹窗容器的z-index高于浏览器默认日历层（Chrome 是 2147483647，安全起见设为2001以上） - 别信“dialog 内部自动聚焦”——手动调用
input.focus()后立刻click()无效，原生 picker 不响应 JS 模拟触发
Firefox 和 iOS Safari 不弹日历？不是 bug，是开关或系统设置问题
这两平台不支持不是前端能绕过的，得按平台规则操作：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- Firefox 桌面版：地址栏输
about:config→ 搜dom.forms.datetimepicker.enabled→ 双击改为true→ 重启生效（Android/iOS 版 Firefox 完全不支持，必须 fallback） - iOS Safari：系统设置 → 通用 → 语言与地区 → 区域必须设为“中国”或“美国”等明确支持项；仅改网页
lang不够，设备级设置才是开关 - 检测是否可用的最小成本方式：
if (!('showPicker' in HTMLInputElement.prototype)) { /* 加 polyfill */ }，推荐date-input-polyfill（3KB，不侵入原生逻辑）
表格里 input[type="date"] 点不动？90% 是盒模型挤爆了
表格单元格对内联元素极其苛刻，原生 date 输入框的触发图标高度依赖空间余量：
立即学习“前端免费学习笔记（深入）”；
- 必须显式设
width: 120px（ISO 日期如2026-10-20至少需要这个宽度） - 必须加
box-sizing: border-box，否则padding会让可点击区变窄甚至消失 - 给
<td> 加 <code>vertical-align: middle，避免文字基线和 input 底边错位，导致点击落空 - 别用
min-width替代width，某些浏览器仍会收缩；也别在<tr> 上直接写 <code>input，浏览器可能把它踢出 DOM 树真正容易被忽略的是：iOS 上即使日历弹出来了，
input.value返回的永远是YYYY-MM-DD字符串，和input.valueAsDate的Date对象行为不一致；而表格中批量渲染几十个type="date"时，每个都会创建独立 native picker 实例——性能敏感场景建议降级为type="text"+ 格式校验。
