用 日历控件My97DatePicker,做了一个简单的2级级联日期联动限制,熟悉下日历的使用。
上级结束的日期不能大于开始日期
子级的开始日期不能小于上级的开始日期,不能大于上级结束日期和子级结束日期中小的
子级的结束日期不能大于上级的结束日期,不能小于 上机结束日期和子级结束日期中的大的
上级开始日期: | 上级结束日期: | ||
子级开始日期: | 子级结束日期: |
上级开始日期:<input class="Wdate" id="startD" type="text" />
上级结束日期:<input class="Wdate" id="endD" type="text" />
<br/><br/>
子级开始日期:<input class="Wdate" id="startDate" type="text">
子级结束日期:<input class="Wdate" id="endDate" type="text" />
<script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script> <script> window.οnlοad=function(){ document.getElementById("startD").onfocus = function(){ WdatePicker({ maxDate:"#F{$dp.$D('endD')}", onpicked:function(){ document.getElementById("endD").focus(); } }); } document.getElementById("endD").οnfοcus=function(){ WdatePicker({ minDate:"#F{$dp.$D('startD')}" }) } document.getElementById("startDate").οnfοcus=function(){ var maxD = ""; if(document.getElementById("endDate").value !=""){ maxD = "endDate"; } if(maxD =="" && document.getElementById("endD").value!=""){ maxD = "endD"; } if(document.getElementById("endDate").value !="" && document.getElementById("endD").value!=""){ maxD = document.getElementById("endDate").value > document.getElementById("endD").value ?"endD":"endDate"; } WdatePicker({ maxDate:"#F{$dp.$D('"+maxD+"')}", minDate:"#F{$dp.$D('startD')}", onpicked:function(){ document.getElementById("endDate").focus(); } }); } document.getElementById("endDate").onfocus = function(){ var minD = ""; if(document.getElementById("startD").value !=""){ minD = "startD"; } if(minD=="" && document.getElementById("startDate").value!=""){ minD = "startDate"; } if(document.getElementById("startD").value !="" && document.getElementById("startDate").value!=""){ minD = document.getElementById("startDate").value>document.getElementById("startD").value ? "startDate":"startD"; } WdatePicker({ maxDate:"#F{$dp.$D('endD')}", minDate:"#F{$dp.$D('"+minD+"')}" }); } } </script>