jQuery UI Datepicker设置显示月份

我需要在另一个控件的click事件中的datepicker上设置显示月份。 那可能吗？ 我不能使用setDate方法，因为那将设置一个特定的日期，而我正在尝试模拟datepicker上的上一个/下个月按钮。

编辑：我正在使用内联日期选择器https://jqueryui.com/datepicker/#inline

HTML：

JavaScript的：

 function ChangeMonth(month) { //set month on datepicker $("#DatePicker").??? } 

Answer 1

假设你有mm / dd / yyyy面具， 就像在演示中你可以这样做：

UPD2。 使用Datepicker API

 function ChangeMonth(month) { var initialVal = $('#datepicker').datepicker('getDate') curMonth = date.getMonth(), if(month > 0 && curMonth < 12){ initialVal.setMonth(curMonth + 1) } if(month < 0 && curMonth > 1) { initialVal.setMonth(curMonth - 1) } $('#datepicker').datepicker('setDate', initialVal); } 

调用ChangeMonth(1)或ChangeMonth(-1)应该更改datapicker字段中的日期。

UPD1。 如果您使用的是内联版本

您可以使用jQuery单击事件“单击”按钮：

 $('#datepicker .ui-datepicker-prev').click() // month back $('#datepicker .ui-datepicker-next').click() //month forward 

Answer 2

要设置日期选择器的月份，请使用以下代码：

 var date = $("#datepicker").datepicker( 'getDate' ); date.setMonth(month); $("#datepicker").datepicker("setDate", date); 

JSFIDDLE https://jsfiddle.net/seadonk/uh9g9sn4/
这是一个如何设置月份，减少月份或增加日期选择器月份的示例。

JQUERY

 $().ready(function(){ $("#SetMonth").click(function(){SetMonth(parseInt($('#month').val())-1);}); $("#NextMonth").click(function(){NextMonth();}); $("#PrevMonth").click(function(){PrevMonth();}); $("#datepicker").datepicker(); $("#datepicker").datepicker("setDate",new Date()); }); function SetMonth(month) { var date = $("#datepicker").datepicker( 'getDate' ); date.setMonth(month); $("#datepicker").datepicker("setDate", date); } function NextMonth() { var date = $("#datepicker").datepicker( 'getDate' ); date.setMonth(date.getMonth() + 1); $("#datepicker").datepicker("setDate", date); } function PrevMonth(month) { var date = $("#datepicker").datepicker( 'getDate' ); date.setMonth(date.getMonth() - 1); $("#datepicker").datepicker("setDate", date); } 

HTML

Answer 3

事实：

• $("#datepicker").datepicker("setDate", date)应该用于设置“选定日期”。 作为副作用，它也将改变“显示月份”。 但仅用它来设置“显示月份”并不是一个好习惯。
• $('#datepicker .ui-datepicker-prev').click()和$('#datepicker .ui-datepicker-next').click()用于设置“显示月份”，它没有侧面效果。 但要注意，如果你在几年之后设置“显示月份”，它就会很慢。
• 没有直接获取当前“显示月份”的function。

根据事实，这是解决方案：

 var currentDate = new Date (); var currentMonth = new Date (currentDate.getFullYear(), currentDate.getMonth(), 1); //Keep currentMonth sync with "display month" $("#datepicker").datepicker({ onChangeMonthYear: function (year, month, inst) { currentMonth = new Date(year, month - 1, 1); //JavaScript used 0...11 for months. Jquery UI used 1...12 for months. }, }); function ChangeMonth(month) { while (currentMonth < month) { $('#datepicker .ui-datepicker-next').click(); }; while (currentMonth > month) { $('#datepicker .ui-datepicker-prev').click(); }; };