基于jquery 的dateRangePicker 和 My97DatePicker

时间：2023-03-09 22:34:26
基于jquery 的dateRangePicker 和 My97DatePicker

引入相应的date插件

<script type="text/javascript" src="../plugins/daterangepicker/moment.min.js"></script>    日期范围插件

<script type="text/javascript" src="../plugins/daterangepicker/jquery.daterangepicker.js"></script>  日期范围插件

<link rel="stylesheet" href="../plugins/daterangepicker/daterangepicker.css" type="text/css" />

<script type="text/javascript" src="<c:url value="/js/My97DatePicker/WdatePicker.js"/>"></script> 单日历插件

在html中引入 input作为日期选择 多个双日历

<input type="text" name="time1" id="DateSearch" class="rangeA" style="width: 180px; border: 1px solid #A9A9A9;" />

<input type="text" name="time2" id="DateSearch" class="rangeA" style="width: 180px; border: 1px solid #A9A9A9;" />

单日历 my97

<input name="date" type="text" onfocus="selectDate()" />

对应的js控制

//单日历控制

     function selectDate() {

         WdatePicker({ dateFmt: 'yyyy-MM-dd', isShowToday: false, isShowClear: false});

      }

//双日历需分开单独初始化

    var dateFormatjson = {

          startOfWeek: 'monday',

          separator : ' -- ',

          format: 'YYYY-MM-DD',

          autoClose: true,

          language:'en',

          time: {enabled: true}

      };

      $('#DateSearch').dateRangePicker(dateFormatjson);

      $('#DateSearch').dateRangePicker(dateFormatjson);

　　

http://www.daterangepicker.com/#options    双日历详细设置详见改地址

https://blog.****.net/u011109420/article/details/51330608   单日历参数设置，语言切换等；

相关文章