jQuery UI日期选择器上个月而不是下个月
[英]Jquery ui date picker previous month instead of the next
问题描述
My problem is that at the second click on input (to) the calendar displays the following month. 
我的问题是，第二次单击输入（到），日历将显示下个月。
For example, on the first click on input (to) the calendar displays Jan and Feb (that's what i want). 例如，在第一次单击输入（到）时，日历显示Jan和Feb（这就是我想要的）。 If I select a date in Jan, there is no problem. 如果我选择一月的日期，那没有问题。 But 1-if I select a date in Feb, the calendar displays Feb and Mar and not Jan and Feb. 2-if I select a date in march, the calendar displays march and april and not feb and march... etc 但是1-如果我选择2月的日期，日历显示2月和3月，而不是1月和2月。2-如果我选择3月的日期，日历显示3月和4月而不是2月和3月...等等
https://jsfiddle.net/aminos12/vty1qk7f/ https://jsfiddle.net/aminos12/vty1qk7f/
var dateFormat = "mm/dd/yy",
from = $( "#from" )
.datepicker({
numberOfMonths: 2
})
.on( "change", function() {
to.datepicker( "option", "minDate", getDate( this ) );
}),
to = $( "#to" ).datepicker({
numberOfMonths: 2
})
.on( "change", function() {
from.datepicker( "option", "maxDate", getDate( this ) );
});
function getDate( element ) {
var date;
try {
date = $.datepicker.parseDate( dateFormat, element.value );
} catch( error ) {
date = null;
}
return date;
jQuery UI version - v1.12.1 Thanks for your help
jQuery UI版本-v1.12.1感谢您的帮助
2 个解决方案
解决方案1
0 2017-01-08 21:34:19
That is the default behaviour of datepicker when you set to show multiple months. 设置为显示多个月时，这是datepicker的默认行为。 If you change the behaviour, you might face a problem of not showing the right month for the first time or people getting annoyed having have to click on next month arrow when it comes to selecting a date in future and open the datepicker again. 如果更改行为，则可能会遇到一个问题，即第一次显示不正确的month ，或者当人们日后要选择日期时，不得不单击下个月的箭头并再次打开datepicker ，这使人们感到恼火。
It would be very important especially for websites like travel agencies when you want to choose from and to dates. 当您想要选择日期和日期时，这对于旅行社之类的网站尤其重要。
A better option is to show the Today button at the bottom of it for ease of use if they have chosen a date in future and then want to go back to the initial two months or selecting today. 如果他们将来选择了某个日期，然后又想回到最初的两个月或选择今天，那么更好的选择是在其底部显示“ Today按钮，以方便使用。
This is done useing showButtonPanel: true in options. 这是通过在选项中使用showButtonPanel: true完成的。
<html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>jQuery UI Datepicker - Display multiple months</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $( function() { $( "#datepicker" ).datepicker({ numberOfMonths: 2, showButtonPanel: true }); } ); </script> </head> <body> <p>Date: <input type="text" id="datepicker"></p> </body> </html>
解决方案2
0 2017-01-08 23:42:37
Datepicker by default does not do this. 默认情况下，日期选择器不执行此操作。
If I understand your question correctly, you want the 2 months to always be this month and next month. 如果我正确理解您的问题，则您希望2个月始终是本月和下个月。 If I select a date in February for "from", then when I click in the "to" field, you still want to see Jan-Feb, is that correct? 如果我将2月的日期选择为“从”，那么当我单击“至”字段时，您仍然希望看到1月至2月，是否正确？ That's how Datepicker works by default. 默认情况下，这就是Datepicker的工作方式。
$( "#from" ).datepicker({
numberOfMonths: 2,
});
$( "#to" ).datepicker({
numberOfMonths: 2,
});
minDate and maxDate set the min/max selectable dates, not the min/max displayed dates. minDate和maxDate设置最小/最大可选日期，而不是显示的最小/最大日期。 If you set minDate to 1st Jan, it just means you can't select 31st Dec. To actually shift which months are shown, use showCurrentAtPos . 如果将minDate设置为1月1日，则意味着您无法选择12月31日。要实际移动显示的月份，请使用showCurrentAtPos 。 If you are displaying 2 months, set showCurrentAtPos: 0 to show the current month at position 0 (the first of the 2). 如果要显示2个月，请设置showCurrentAtPos: 0以在位置0（2的第一个）显示当前月份。 Note that this example is meaningless since this is the default behaviour! 请注意，此示例是毫无意义的，因为这是默认行为！
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.