【问题标题】:jQueryUI DatePicker 12 months view 'jumps' when clicked on datejQueryUI DatePicker 12 个月点击日期时查看“跳跃”
【发布时间】:2012-04-17 20:10:40
【问题描述】:

我正在尝试使用 jquery-ui-1.8.17 显示 12 个月的日期选择器日历并为其设置样式。 在Styling the jQueryUI DatePicker 的帮助下,日历最初显示良好,即它在 3 行中显示完整的一年,每行包含 4 个月。 但是,当我单击日历中的某一天时,显示会跳转到包含 12 个月的 1 行! 任何人也看到这种奇怪的行为或有解决方案?

注意:在我的代码中,我包含了 jquery-ui-1.8.17.custom.css。这是使用http://jqueryui.com/themeroller 生成的文件。查看 css 文件中的链接。

这是完整的代码

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">        
    <link rel="stylesheet" type="text/css" media="screen" href="http://www.j2u.nl/jquery-ui-1.8.17.custom.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js" type="text/javascript"></script>
    <script src="http://jquery-ui.googlecode.com/svn-history/r3982/trunk/ui/i18n/jquery.ui.datepicker-nl.js" type="text/javascript"></script>

    <script>
     $(document).ready(function(){
        $(".datepicker").datepicker ({
        dateFormat: 'dd-MM-yy',
        firstDay: 1, // rows starts on Monday
        minDate: new Date(),
        maxDate: '+1Y',
        numberOfMonths: 12
     });
     $(".ui-datepicker-inline").width("850px");
     $(".ui-widget").css("font-size","0.9em");
     });
  </script>         
</head>
<body>
     <p><div class="datepicker"></div></p>
</body>

</html>

【问题讨论】:

  • 请发布一个示例或您的其余代码,包括 CSS。我扔掉了你在 jsFiddle 上发布的内容,并得到了一长串的月份。
  • 现在添加了完整的代码!也作为小提琴:jsfiddle.net/r7pEe

标签: jquery jquery-ui datepicker


【解决方案1】:

哇,在将问题发布到 jquery-ui 错误列表 5 分钟后,有人回答了。 基本上 numberOfMonths: [3,4] 和添加的样式就可以了:

<style>.ui-widget { font-size: 62.5% }</style>
<script>
 $(document).ready(function(){
    $(".datepicker").datepicker ({
    dateFormat: 'dd-MM-yy',
    firstDay: 1, // rows starts on Monday
    minDate: new Date(),
    maxDate: '+1Y',
    numberOfMonths: [3,4]
 });
 });

【讨论】:

  • 实际上并没有帮助。我在 2 列中有 2 个月,我设置 NumberOfMonths: [2,1] 然后 NumberOfMonths: [2,1] 他们都没有工作
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-04-18
  • 1970-01-01
  • 2019-06-03
  • 2021-06-23
相关资源
最近更新 更多