可能这是一个老问题......但让我尝试一下。 我只是想使用 UI 组件更新一些旧的 WEB 页面，特别是我从未使用过的 Datepicker 小部件。 经过大量学习和多次尝试后，我能够“理解”一些东西，使用 2 个小部件创建一个简单的测试页面；我希望用户在从数据库获取的 2 个限制日期之间选择一个日期。
除了 minDate 和 maxdate 设置之外，一切看起来都很好。 使用 2 个字符串设置限制（格式设置为“dd/mm/yy”）：
var firstStr="01/09/24";
var lastStr="30/09/24";
我得到了从 10 月 27 日到 11 月 25 日的跨度，与想要的日期有任何明显的关系。
这是我正在使用的压缩页面（我将 CSS 和 JS 包含在该页面内）：
<!DOCTYPE html>
<html class="no-js" lang="it" >
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Stats</title>
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/jquery-ui.theme.css">
<style>
body{background:#444;}
P.statP {
display:inline-block;
width:150px;
color:#fff;
border:1px solid #ff8;
margin:0;
text-align:center;
}
Input.statI {
width:148px;
text-align:center;
}
DIV.statDiv{
float:left;
margin-left:10px;
width:320px;
border:1px solid #faa;
}
Label.statLbl {
display:inline-block;
width:150px;
color:#f84;
}
</style>
</head>
<body>
<div class="sfondoStat">
<div class="statDiv">
<label class="statLbl" for="datepickerFrom"> Start at: </label>
<input class="statI" type="text" id="datepickerFrom">
<p class="statP" id="date1"></p>
<p class="statP"> <span id="d1"></p>
</div>
<div class="statDiv">
<label class="statLbl" for="datepickerTo"> End at: </label>
<input class="statI" type="text" id="datepickerTo">
<p class="statP" id="date2"></p>
<p class="statP"> <span id="d2"></p>
</div>
</div>
<!-- ======================== scripts ============================= -->
<script src="js/jquery-2.2.4.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript">
var today=Date();
var format = "dd/mm/yy";
var firstStr="01/09/24";
var lastStr="30/09/24";
var startDate = "";
var endDate = "";
$(document).ready(function(){
$("#date1").text("min: "+firstStr);
$("#date2").text("max: "+lastStr);
$.datepicker.setDefaults({
dateFormat: format,
changeMonth: true,
changeYear: true,
showOn: "focus",
numberOfMonths: 1,
minDate: firstStr,
maxDate: lastStr,
setDate: today
});
$("#datepickerFrom").datepicker({
onSelect: function(startDate){
$("#d1").text(startDate),
$("#datepickerTo").datepicker("option","minDate",startDate)
}
});
$("#datepickerTo").datepicker({
onSelect: function(endDate){
$("#d2").text(endDate)
}
});
});
</script>
</body>
</html>
我在这个问题上看到了几个类似的主题，但没有一个给我解决方案。 即使设置： minDate = new Date (firsString) - 和 maxDate 相同 - 也没有完成这项工作......这甚至是最糟糕的。
var format = "dd/mm/y";