在Firefox和Edge上隐藏默认日期输入菜单

Question

我正在使用i ApiCallFunction(DataText,"Bill_master","ReturnFunction"); 和Vuejs开发自定义日期选择器组件。我想使用自定义日期选择器菜单，因此必须隐藏或禁用默认菜单，例如：

如何使用CSS或JS做到这一点？

Answer 1

我没有找到在每个浏览器中隐藏默认选择器的方法，尤其是对于Edge（不是基于铬的版本）来说，似乎没有办法隐藏它。

要在Chrome和Firefox上隐藏选择器，我只是覆盖了输入的onclick方法：

onClick (e) {
    e.preventDefault() // Prevent the default picker from showing up
    showPicker(this) // Show the custom picker
}

如果用户使用Edge，则只需禁用自定义选择器并使用默认选择器。我使用bowser来检测当前的浏览器：

const Bowser = require("bowser");
const browser = Bowser.getParser(window.navigator.userAgent);
const isEdge = browser.satisfies({ 'microsoft edge': '>0' });