layui时间日期控件使用

最新推荐文章于 2024-09-20 17:01:39 发布

优小U

最新推荐文章于 2024-09-20 17:01:39 发布

阅读量8.1k

点赞数 2

分类专栏： layui 文章标签： layui laydate 时间选择控件

本文为博主原创文章，未经博主允许不得转载，违者必究。

本文链接：https://blog.csdn.net/zy1281539626/article/details/62893082

版权

layui 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<div class="layui-form-pane" style="margin-top: 15px;">
    <div class="layui-form-item">
      <label class="layui-form-label">范围选择</label>
      <div class="layui-input-inline">
        <input class="layui-input laydate-icon" placeholder="开始日" id="LAY_demorange_s">
      </div>
      <div class="layui-input-inline">
        <input class="layui-input laydate-icon" placeholder="截止日" id="LAY_demorange_e">
      </div>
    </div>
</div> 
<script type="text/javascript" src="layui/lay/dest/layui.all.js"></script>
<script type="text/javascript">
      var $ = layui.jquery,
	    element = layui.element(),
      form  = layui.form();

      var start = {
        min: laydate.now()
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,format: 'YYYY-MM-DD hh:mm:ss'//日期格式
        ,istime:true
        ,choose: function(datas){
          end.min = datas; //开始日选好后，重置结束日的最小日期
          end.start = datas //将结束日的初始值设定为开始日
        }
      };
      
      var end = {
        min: laydate.now()
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,format: 'YYYY-MM-DD hh:mm:ss'//日期格式
        ,istime:true
        ,choose: function(datas){
          start.max = datas; //结束日选好后，重置开始日的最大日期
        }
      };
      document.getElementById('LAY_demorange_s').onclick = function(){
        start.elem = this;
        laydate(start);
      }
      document.getElementById('LAY_demorange_e').onclick = function(){
        end.elem = this
        laydate(end);
      }
</script>