Chrome上的原生日期选择器和IE / Firefox的后备

Question

与HTML5一起出现了一组新的输入类型。其中一个是date，在Chrome中，此输入会生成一个很好的原生日期选择器，如下所示。

它还在移动设备上提供原生日期选择器，这是我使用新输入类型的主要优势。

但是，在Firefox（23.0.1）和IE（10）上，未显示本机日期选择器，输入被视为普通文本输入。在这些情况下，我想回到Javascript日期选择器。

这是用于运行AngularJS的站点，当前的datepicker插件是bootstrap-datepicker。如果浏览器支持本机日期选择器，那么禁用此插件的最简单方法是什么？我是否只需要检查浏览器是否支持date输入类型并禁用插件（如果是这种情况）？

Answer 1

您可以像这样进行HTML5功能检查：

// Determine if this browser supports the date input type.
var dateSupported = (function() {
    var el = document.createElement('input'),
        invalidVal = 'foo'; // Any value that is not a date
    el.setAttribute('type','date');
    el.setAttribute('value', invalidVal);
    // A supported browser will modify this if it is a true date field
    return el.value !== invalidVal;
}());

然后仅在!dateSupported。

初始化bootstrap datepicker

Answer 2

我做了这样的功能检查。它包括检查是否需要选择器。

if (
  $('input[type="date"]').length
  && $('input[type="date"]').get(0).type == "date") {

  // Load Fallback Date Picker
}