我正在尝试使用 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>
最佳答案
哇，将问题发布到 jquery-ui bug 列表 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]
});
});
关于单击日期时 jQueryUI DatePicker 12 个月 View 'jumps'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10198379/