jQuery UI Datepicker 添加天数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3813973/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery UI Datepicker Add Days
提问by Andrew
I'm attempting to create something of range system for booking rooms on a hotel website and I'm using jQuery UI Datepicker to allow the user to select their check in date. What I then want to do is create another field that's simple "Number of Nights" and have jQuery Datepicker take the check in date, add the number of nights, and set the resulting date as the value of a hidden input (in the correct date format). It would look something like this:
我正在尝试为酒店网站上的预订房间创建一些范围系统，并且我正在使用 jQuery UI Datepicker 来允许用户选择他们的入住日期。然后我想做的是创建另一个简单的“夜数”字段，并让 jQuery Datepicker 获取入住日期，添加夜数，并将结果日期设置为隐藏输入的值（在正确的日期格式）。它看起来像这样：
<input type="text" name="arrivalDate" class="datepicker">
<input type="text" name="numOfNights">
<input type="hidden" name="departureDate" value="arrivalDate + number of nights">
Is this possible? Thanks in advance.
这可能吗？提前致谢。
(Note: The database I'll be "get"-ing from with this form is a little temperamental and I don't have access to it beyond just a few query-able values.)
（注意：我将使用此表单“获取”的数据库有点喜怒无常，除了几个可查询的值之外，我无法访问它。）
回答by Alpesh
The above can be achieved by following code -
以上可以通过以下代码实现 -
$('input[name="arrivalDate"]').datepicker({
//your other configurations.
onSelect: function(){
var start = $('input[name="arrivalDate"]').val();
var nights = $('input[name="numOfNights"]').val();
var date = new Date(start);
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var edate= new Date(y, m, d+nights);
$('input[name="departureDate"]').val(edate);
}
});
回答by RememberME
You can update the value of the hidden field in the onSelect events for the arrivalDate datepicker.
您可以更新到达日期日期选择器的 onSelect 事件中隐藏字段的值。
$('#arrivalDate').datepicker({
onSelect: function(dateStr) {
var nights = parseInt($('#numOfNights').val());
var depart = $.datepicker.parseDate('mm/dd/yy', dateStr);
depart.setDate(depart.getDate() + nights);
$('#departureDate').val(depart);
}
});
You'll have to also update the departureDate field from the change event of the numOfNights field.
您还必须从 numOfNights 字段的更改事件更新离开日期字段。
$('#numOfNights').change(function() {
var nights = parseInt($('#numOfNights').val());
var depart = $.datepicker.parseDate('mm/dd/yy', $('#arrivalDate').val());
depart.setDate(depart.getDate() + nights);
$('#departureDate').val(depart);
});
Try it out here: http://jsfiddle.net/JKGvD/
在这里试试：http: //jsfiddle.net/JKGvD/
You'd probably want to make that a function and also use it to initialize the departureDate if your arrivalDate has an initial value.
如果您的到达日期具有初始值，您可能希望将其设为一个函数并使用它来初始化离开日期。
回答by JasCav
Use the setDate function.
使用setDate 函数。
setDate
Signature: .datepicker( "setDate" , date )
Sets the current date for the datepicker. The new date may be a Date object or a string in the current date format (e.g. '01/26/2009'), a number of days from today (e.g. +7) or a string of values and periods ('y' for years, 'm' for months, 'w' for weeks, 'd' for days, e.g. '+1m +7d'), or null to clear the selected date.
设置日期
签名： .datepicker( "setDate" , date )
设置日期选择器的当前日期。新日期可以是 Date 对象或当前日期格式的字符串（例如 '01/26/2009'）、距今天的天数（例如 +7）或一串值和句点（'y' 表示年，'m' 表示月，'w' 表示周，'d' 表示天，例如 '+1m +7d')，或 null 以清除所选日期。
