jquery.datepick日历控件
祁增
2023-12-01
首先应该导入jquery.datepick的css和js文件,可以在这个地址中下载http://plugins.jquery.com/project/datepick 下载datepick插件包;还有下载一个jQuery.js包。
在页面中引入下面的文件
@import "<%=request.getContextPath()%>/css/jquery.datepick.css";
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquerydate/jquery-latest.pack.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquerydate/jquery.datepick.pack.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquerydate/jquery.datepick-zh-CN.js"></script>
<script type="text/javascript">
$(function() { //页面加载完成之后自动调用的方法。
var startDate = new Date();
startDate.setDate(startDate.getDate()-1);//用户只可以选择从昨天开始的时间
var endDate = new Date();
endDate.setDate(endDate.getDate()+4);//限定用户可选时间的范围
$('#beginDate').datepick({minDate: startDate,maxDate: endDate});
$('#endDate').datepick({minDate: new Date(),maxDate: endDate});
});
</script>
开始时间: <input id="beginDate" name="beginDate" class="inputbg" value="<c:if test="${flagvalue6 !=''}">${flagvalue6}</c:if><c:if test="${flagvalue6 ==''||flagvalue6==null}">${date_10}</c:if>" type="text" size="15" maxlength="10" readonly="1" style="height:18"/>
至截止时间: <input id="endDate" name="endDate" class="inputbg" value="<c:if test="${flagvalue7 !=''}">${flagvalue7}</c:if><c:if test="${flagvalue7 ==''||flagvalue7==null}">${dateStr}</c:if>" type="text" size="15" maxlength="10" readonly="1" style="height:18"/>
这个地址介绍的这个控件非常的详细,大家可以看一下
http://www.my97.net/dp/demo/index.htm