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

Joh*_*ean 9 javascript datepicker angularjs

与HTML5一起出现了一组新的输入类型.其中一个是date在Chrome中,这个输入产生一个很好的原生日期选择器,如下所示.

日期选择器

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

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

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

Sco*_*tux 9

您可以像这样执行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;
}());
Run Code Online (Sandbox Code Playgroud)

然后只初始化bootstrap datepicker if !dateSupported.