html - 即使正确使用 modernizr,歌剧也会显示多个日期选择器

标签 html datepicker opera modernizr

我已经按照一些教程和书籍使用 html5 forms。我使用 modernizr 为不支持的浏览器提供后备。一切都很好。事情甚至在 IE6 中工作。我正面临 jquery datepicker ui 的问题。目前 input type="date" 仅被 opera 支持(我使用的是最新版本的 opera)。


虽然我使用 modernizr 来检测浏览器对 input type="date" 的支持,但不知何故 opera 仍在加载 jquery datepicker。我做错了什么吗??...我应该按特定顺序包含脚本吗??...


这是我编写的代码以及问题的屏幕截图。

html 标记:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>date picker</title>
<link rel="stylesheet" href="jquery-ui/css/redmond/jquery-ui-1.8.20.custom.css"/>
</head>
<body>
<form>
    <input type="date" name="date-picker" id="date-picker" value="2010-10-06" />
</form>
<script src="modernizr.js"></script>
<script src="webforms/webforms2.js"></script>
<script src="jquery.js"></script>
<script src="jquery.ui.core.min.js"></script>
<script src="jquery.ui.datepicker.min.js"></script>
<script src="custom.js"></script>
</body>
</html>

jquery 代码:

$(document).ready(function(){
    if(!Modernizr.inputtypes.date){
        $('input[type=date]').each(function() {
        var $input = $(this);
        $input.datepicker({
            minDate: $input.attr('min'),
            maxDate: $input.attr('max'),
            dateFormat: 'yy-mm-dd'
        });
    });
 }  
});

截图:

http://imageshack.us/photo/my-images/16/operadatepicker.jpg/

源代码: media fire download link

最佳答案

Modernizr.inputtypes.date 在 Opera 11 中按预期工作:

http://jsfiddle.net/feeela/tMUcw/

也许错误是您没有在您构建的 Modernizr 中包含“输入类型”。前往并下载开发者版本或构建自定义下载,但请确保包含“输入类型”。

http://modernizr.com/download/

关于html - 即使正确使用 modernizr,歌剧也会显示多个日期选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10850786/

相关文章:

javascript - 一开始如何不启用切换类?

NodeJS 中的 HTML5 Web Worker?

javascript - 如何使用 bootstrap-datepicker 沙盒限制 1 个月内的天数选择?

javascript - javascript中的日期选择器

javascript - 单击日期选择器中仅突出显示日期的事件

javascript - 检测不支持 onunload/onbeforeunload 的浏览器

html - JS判断哪一层在前面

javascript - 导航链接不起作用( Bootstrap )

html - 样式导航栏切换 Bootstrap

IE 中的 JavaScript Math.round 错误