我的应用程序要求日期选择器应该在点击时显示日历主体,选择今天的日期处于活动状态,将来的日期停用...我是jquery的新手,它让我感到不安一个月。请帮助。我可以显示日期选择器并选择截至2030年的任何日期,但我需要日历才能激活到今天的日期或当前日期。 提前谢谢。
我的日历要显示..
<table id="calenderTable" class="">
<tbody id="calenderTableHead">
<tr>
<td colspan="4" align="center">
<select onChange="showCalenderBody(createCalender(document.getElementById('selectYear').value,
this.selectedIndex, false));" id="selectMonth">
<option value="0">Jan</option>
<option value="1">Feb</option>
<option value="2">Mar</option>
<option value="3">Apr</option>
<option value="4">May</option>
<option value="5">Jun</option>
<option value="6">Jul</option>
<option value="7">Aug</option>
<option value="8">Sep</option>
<option value="9">Oct</option>
<option value="10">Nov</option>
<option value="11">Dec</option>
</select>
</td>
<td colspan="2" align="center">
<select onChange="showCalenderBody(createCalender(this.value,
document.getElementById('selectMonth').selectedIndex, false));" id="selectYear">
</select>
</td>
<td align="center">
<a href="#" onClick="closeCalender();"><font color="#003333" size="+1">X</font></a>
</td>
</tr>
</tbody>
<tbody id="calenderTableDays">
<tr style="">
<td>Sun</td><td>Mon</td><td>Tue</td><td>Wed</td><td>Thu</td><td>Fri</td><td>Sat</td>
</tr>
</tbody>
<tbody id="calender"></tbody>
</table>
日期字段如下:
<tr>
<td>effected date</td>
<td>
<input type="text" name="eff_date" class="required" id="eff_date"><a href="#" onClick="setYears(1947, 2030);
showCalender(this, 'eff_date');" class="" id="calender">
<img src="Calender/calender.png"></a>
</td>
</tr>
答案 0 :(得分:4)
假设我理解这个问题,这很容易实现。您想设置允许的最大可选日期,对吗?您需要使用的只是maxDate选项。
这是一个完整的示例,假设您包含脚本和链接标记中引用的正确文件:
<!DOCTYPE HTML>
<html>
<head>
<title>date</title>
<meta charset="utf-8">
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>
</head>
<body>
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div>
<script>
$(function() {
$("#datepicker").datepicker({maxDate: '+0d'});
});
</script>
</body>
</html>
你可以看到它在这里工作: http://gigaloop.com/answers/date.html
答案 1 :(得分:1)
您可以使用maxDate并与minDate结合使用: http://jqueryui.com/demos/datepicker/#option-maxDate
答案 2 :(得分:1)
在脚本代码中,写一下:
$(function() {
$( "#datepicker-1" ).datepicker({
minDate:"Now", maxDate: "+1m+1d"
});
});
您可以将minDate更改为&#34; -1m&#34;如果你想显示1个月前和未来1个月的日期。根据你的问题,你可以把maxDate:&#34; + 1d&#34;如果你想从今天开始禁用未来的日子。 1Y =1年,1M =1个月,1D =1天。