javascript - HTML 5 输入类型 =“date” 在 Firefox 中不起作用

Question

我正在使用 HTML5 <input type="date" /> ，这在 Chrome 中运行良好，我得到了日历弹出窗口来选择日期。

但在 firefox 中它就像一个文本框，不会弹出日历。

在做了一些研究后，我发现很少有使用 webshims、modenizr 等的解决方案...但我不想使用 jQuery。

有替代方案吗？我怎样才能让它在 Firefox 中工作？

Answer 1

编辑:来自 Firefox 57，<input type="date"/>是partially supported .

---

火狐 doesn't support HTML5's <input type="date"/> 还没有。

你有两个选择:

• 始终使用 Javascript 日期时间选择器，或者
• 检查浏览器是否支持该标签，如果支持则使用它，如果不支持则回退到 javascript 日期选择器(jQuery 或其他某个)。

这叫做 Feature Detection , 和 Modernizr是最受欢迎的库。

始终使用 javascript 日期选择器更容易和更快，但它不会在禁用 javascript 的情况下工作(谁在乎)，它在移动设备上会非常糟糕(这很重要)并且会闻起来很旧。

改用混合方法将使您涵盖现在的所有情况，直到每个浏览器都将以标准化方式支持 HTML5 日期选择器的那一天，并且根本不需要 javascript。它是面向 future 的，并且this is especially important in mobile browsing ，javascript 日期选择器几乎无法使用。

这是在每个 <input type="date"/> 上执行此操作的启动示例每个页面的自动元素:

<script>
    $(function(){           
        if (!Modernizr.inputtypes.date) {
        // If not native HTML5 support, fallback to jQuery datePicker
            $('input[type=date]').datepicker({
                // Consistent format with the HTML5 picker
                    dateFormat : 'yy-mm-dd'
                },
                // Localization
                $.datepicker.regional['it']
            );
        }
    });
</script>

它使用 jQuery，因为我使用 jQuery，但您可以自由地将 jQuery 部分替换为 vanilla javascript，并将日期选择器部分替换为您选择的 javascript 日期选择器。