zoukankan      html  css  js  c++  java
  • 基于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=" 180px; border: 1px solid #A9A9A9;" />
    
    <input type="text" name="time2" id="DateSearch" class="rangeA" style=" 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.csdn.net/u011109420/article/details/51330608   单日历参数设置,语言切换等;

  • 相关阅读:
    github首页添加README.md
    uni-app 使用问题记录
    rgb转16进制js方法,npm插件
    升级vue3注意事项记录 vue3都需要升级些什么
    获取当前网页的协议+域名(兼容IE)
    C++ 真随机
    vue打包后反编译到源代码(reverse-sourcemap)(转载)
    vue导出页面为pdf文件
    设计模式总结
    访问者模式
  • 原文地址:https://www.cnblogs.com/xhliang/p/9006985.html
Copyright © 2011-2022 走看看