使用My97DatePicker制作季度选择器
1、下载My97DatePicker的js文件，并添加到项目，方便我们后面在项目中快速引用。
2、新建页面，并将添加到项目中的js文件，引入到页面。引入方法如下：
<script src="/Scripts/My97DatePicker/WdatePicker.js"></script>
3、在新建的页面，添加需要使用季度选择器的input元素。
<div class="layui-inline AfterSysTable" style="display: none;">
<label class="layui-form-label">
开始季度：
</label>
<div class="layui-input-inline">
<input id="StartQuarter" type="text" name="StartQuarter" class="layui-input" />
</div>
</div>
<div class="layui-inline AfterSysTable" style="display: none;">
<label class="layui-form-label">
截止季度：
</label>
<div class="layui-input-inline">
<input id="EndQuarter" type="text" name="EndQuarter" class="layui-input" />
</div>
</div>
4、编写js代码，实现input选择的点击事件，用于触发季度选择器。此处需要注意，My97DatePicker原本不支持季度选择，我们这里通过禁用一些日期，然后格式化为我们想要的格式，即：yyyy年MM季度
var elem = $("#StartQuarter");
// 季度绑定日历控件
if(elem.length > 0){
elem.attr("readonly", "readonly");
elem.on("click",function(){
WdatePicker({el:this, dateFmt:'yyyy年MM季度',disabledDates:['....-0[5-9]-..','....-1[0-2]-..'],startDate:'%y-01-01',minDate:'#F{$dp.$D(\'EndQuarter\',{y:-1});}', maxDate:'#F{$dp.$D(\'EndQuarter\');}'});
}).attr("readonly", "readonly");
$("#EndQuarter").on("click",function(){
WdatePicker({el:this, dateFmt:'yyyy年MM季度',disabledDates:['....-0[5-9]-..','....-1[0-2]-..'],startDate:'%y-01-01', maxDate:'#F{$dp.$D(\'StartQuarter\',{y:+1});}',minDate:'#F{$dp.$D(\'StartQuarter\');}'});
}).attr("readonly", "readonly");
$("#StartQuarter,#EndQuarter").val(date.getFullYear() + "年0" + (parseInt(date.getMonth() / 3) + 1) + "季度");
}
5、保存代码，运行页面，即可看见效果。
