【问题标题】:even with the proper use of modernizr, opera is displaying multiple datepickers即使正确使用了modernizr,opera 也会显示多个日期选择器
【发布时间】:2012-06-06 17:23:36
【问题描述】:

我遵循了一些教程和书籍来使用 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

【问题讨论】:

  • ps 你不需要.each,那个选择器已经覆盖了所有的输入。有趣的问题虽然如此+1。 (即你可以使用$('input[type=date]').datepicker({ .. });
  • 我的错。我只是盲目地遵循了几个教程,其中包括相同的脚本......我下次会避免它:)......我在所有可能的社交网络中关注你......谢谢你的收获;)

标签: html datepicker opera modernizr


【解决方案1】:

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

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

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

http://modernizr.com/download/

【讨论】:

  • 嘿,谢谢你的想法......实际上直到现在我从首页下载了modernizr......现在我将使用自定义构建......现在事情已经解决......你指出我在新的方向:)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-04-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多