如何通过jQuery获取flatpickr实例？传入jQuery对象时获取失败

API 探路者

2026-7-13

解决jQuery环境下获取flatpickr实例的问题

问题原因

你遇到的问题本质是：jQuery对象是原生DOM元素的包装集合，不是单个DOM节点。flatpickr初始化后会把实例挂载在原生DOM元素的_flatpickr属性上，而不是jQuery包装对象上，所以直接访问jQuery对象的_flatpickr会返回undefined。

解决方案

提供两种可行方案，按需选择：

方案1：调用时直接传入原生DOM元素

从jQuery对象中提取原生节点（用[0]或.get(0)），再传入函数：

// 调用方式修改为
flatpickrMinDate($("#dateOpen")[0], $("#dateClosed")[0]);
// 或者用.get(0)
flatpickrMinDate($("#dateOpen").get(0), $("#dateClosed").get(0));

原函数无需修改，就能正常工作。

方案2：修改函数兼容两种输入

让函数自动识别并处理原生DOM和jQuery对象，不用改调用代码：

function flatpickrMinDate($openDate, $closeDate) {
    // 提取原生DOM元素
    const openEl = $openDate instanceof jQuery ? $openDate[0] : $openDate;
    const closeEl = $closeDate instanceof jQuery ? $closeDate[0] : $closeDate;
    
    const fp = closeEl._flatpickr;
    if (!fp) return;
    fp.set('minDate', openEl.value);
}

这样不管传原生DOM还是jQuery对象，函数都能正确获取flatpickr实例并设置minDate。