我已经遵循 jQuery UI Datepicker 示例代码
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function () {
$("#datepicker1").datepicker();
$("#datepicker1").change(function () {
alert($(this).val());
var date = $(this).datepicker();
$("#datepicker2").val("option", "dd-mm-yy", $(this).val());
//alert($( "#datepicker2" ).val());
});
});
</script>
</head>
<body>
<p>Date1: <input type="text" id="datepicker1"></p>
<p>Date2: <input type="text" id="datepicker2"></p>
<p>Date3: <input type="text" id="datepicker3"></p>
<p>Date4: <input type="text" id="datepicker4"></p>
</body>
</html>
我想根据 datepicker1 中选择的值设置日期选择器 2,3 和 4 的值。
假设如果 #datepicker1 的值为 12/05/2013 那么我想为每个其他 jQuery 日期选择器显示 +1 日期,如下所示
datepicker1 => 12/05/2013 then
datepicker2 => 12/06/2013
datepicker3 => 12/07/2013
datepicker4 => 12/08/2013
我在上面尝试过。
你能帮忙吗?
最佳答案
$("#datepicker1, #datepicker2, #datepicker3, #datepicker4").datepicker();
$("#datepicker1").datepicker("option", "onSelect", function (dateText, inst) {
var date1 = $.datepicker.parseDate(inst.settings.dateFormat || $.datepicker._defaults.dateFormat, dateText, inst.settings);
var date2 = new Date(date1.getTime());
date2.setDate(date2.getDate() + 1);
$("#datepicker2").datepicker("setDate", date2);
var date3 = new Date(date1.getTime());
date3.setDate(date3.getDate() + 2);
$("#datepicker3").datepicker("setDate", date3);
var date4 = new Date(date1.getTime());
date4.setDate(date4.getDate() + 3);
$("#datepicker4").datepicker("setDate", date4);
});
onSelect
将日期作为字符串传递,因此我们将其转换为 JavaScript Date object为了方便起见,使用以下 jQuery UI 日期选择器实用函数:
$.datepicker.parseDate( format, value[, settings] )
表达式:
inst.settings.dateFormat || $.datepicker._defaults.dateFormat
表示使用日期选择器上指定的dateFormat
值(如果有);否则使用日期选择器默认值中的dateFormat
(即“mm/dd/yy”
)。
关于javascript - 根据一个日期选择器的选定日期设置多个日期选择器的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20397247/