精华内容
下载资源
问答
  • layui时间区间问题

    2019-11-06 18:56:38
    设置起止时间,约束,结束时间不能小于开始时间,开始时间不能大于结束时间 <input type="text" class="form-control" name="beginTime" id="beginTime" th:value="${#dates.format(beginTime,'yyyy-MM-dd HH:mm...

    设置起止时间,约束,结束时间不能小于开始时间,开始时间不能大于结束时间

    <input type="text" class="form-control" name="beginTime" id="beginTime" th:value="${#dates.format(beginTime,'yyyy-MM-dd HH:mm:ss')}"/>
    <span>-</span>
    <input type="text" class="form-control" name="endTime" id="endTime" th:value="${#dates.format(endTime,'yyyy-MM-dd HH:mm:ss')}"/>
    

    涉及到时分秒级别,如下:

    layui.use('laydate', function() {
    			var laydate = layui.laydate;
    			var startDate = laydate.render({
    				elem: '#beginTime',
    				max: $('#endTime').val(),
    				theme: 'molv',
    				type: 'datetime',
    				trigger: 'click',
    				done: function(value, date) {
    					// 结束时间大于开始时间
    					if (value !== '') {
    						endDate.config.min.year = date.year;
    						endDate.config.min.month = date.month - 1;
    						endDate.config.min.date = date.date;
    						endDate.config.min.hours = date.hours;
    						endDate.config.min.minutes = date.minutes;
    						endDate.config.min.seconds = date.seconds;
    					} else {
    						endDate.config.min.year = '';
    						endDate.config.min.month = '';
    						endDate.config.min.date = '';
    						endDate.config.min.hours = '';
    						endDate.config.min.minutes = '';
    						endDate.config.min.seconds = '';
    					}
    				}
    			});
    
    			var endDate = laydate.render({
    				elem: '#endTime',
    				min: $('#beginTime').val(),
    				theme: 'molv',
    				type: 'datetime',
    				trigger: 'click',
    				done: function(value, date) {
    					// 开始时间小于结束时间
    					if (value !== '') {
    						startDate.config.max.year = date.year;
    						startDate.config.max.month = date.month - 1;
    						startDate.config.max.date = date.date;
    						startDate.config.max.hours = date.hours;
    						startDate.config.max.minutes = date.minutes;
    						startDate.config.max.seconds = date.seconds;
    					} else {
    						startDate.config.max.year = '';
    						startDate.config.max.month = '';
    						startDate.config.max.date = '';
    						startDate.config.max.hours = '';
    						startDate.config.max.minutes = '';
    						startDate.config.max.seconds = '';
    					}
    				}
    			});
    
    		});
    
    展开全文
  • layui时间区间指定(限定一个月)

    千次阅读 2019-06-04 11:55:59
    //时间选择器 layui.use('laydate', function(){ var laydate = layui.laydate; var startTime=laydate.render({ elem: '#test1', done:function(value,date){ ...
    //时间选择器
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        var startTime=laydate.render({
            elem: '#test1',
            done:function(value,date){
                endTime.config.min={
                    year:date.year,
                    month:date.month-1,
                    date:date.date,
                };
                endTime.config.max={
                    year:date.year,
                    month:date.month,
                    date:date.date,
                };
    
    
            }
        });
        var endTime=laydate.render({
            elem: '#test2',
            done:function(value,date){
                startTime.config.max={
                    year:date.year,
                    month:date.month-1,
                    date:date.date,
                };
                startTime.config.min={
                    year:date.year,
                    month:date.month-2,
                    date:date.date,
                };
            }
        });
    });
    
    展开全文
  • 1.示例图: 代码: <div class="layui-form-inline"> ...label class="layui-form-label">活动时间</label> <div class="layui-input-inline"> <input type="text" ...

    1.示例图:

    代码:

    <div class="layui-form-inline">
            <label class="layui-form-label">活动时间</label>
            <div class="layui-input-inline">
                <input type="text" id="start_time" name="start_time" autocomplete="off" placeholder="请输入开始时间" class="layui-input">
            </div> 至
            <div class="layui-input-inline">
                <input type="text" id="end_time" name="start_time" autocomplete="off" placeholder="请输入结束时间" class="layui-input">
            </div>
    </div>

     

     

    2.当设置了start_time以后,end_time肯定要大于start_time,否则要设置为不可选,

    当设置了end_time以后,start_time肯定要小于start_time,否则要设置为不可选,

    3.具体操作如下:复制以下代码即可

    <script>
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            var endDate= laydate.render({
                elem: '#end_time',//选择器结束时间
                type: 'datetime',
                min:"1970-1-1",//设置min默认最小值
                done: function(value,date){
                    startDate.config.max={
                        year:date.year,
                        month:date.month-1,//关键
                        date: date.date,
                        hours: 0,
                        minutes: 0,
                        seconds : 0
                    }
                }
            });
            //日期范围
            var startDate=laydate.render({
                elem: '#start_time',
                type: 'datetime',
                max:"2099-12-31",//设置一个默认最大值
                done: function(value, date){
                    endDate.config.min ={
                        year:date.year,
                        month:date.month-1, //关键
                        date: date.date,
                        hours: 0,
                        minutes: 0,
                        seconds : 0
                    };
                }
            });
    
        });
    </script>

           

     

     

     

    展开全文
  • layui时间范围

    2018-08-10 16:10:28
    layui时间区间搜索功能 如何锁定 开始时间 结束时间 的可选范围 &lt;div class="layui-form-inline"&gt; &lt;label class="layui-form-label"&gt;活动时间&lt;/label&...

    layui时间范围

    layui时间区间搜索功能 如何锁定 开始时间 结束时间 的可选范围
    <div class="layui-form-inline">
            <label class="layui-form-label">活动时间</label>
            <div class="layui-input-inline">
                <input type="text" id="start_time" name="start_time" autocomplete="off" placeholder="请输入开始时间" class="layui-input">
            </div> 至
            <div class="layui-input-inline">
                <input type="text" id="end_time" name="start_time" autocomplete="off" placeholder="请输入结束时间" class="layui-input">
            </div>
    </div>
    
    
    2.当设置了start_time以后,end_time肯定要大于start_time,否则要设置为不可选,
    
    当设置了end_time以后,start_time肯定要小于start_time,否则要设置为不可选
    <script>
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            var endDate= laydate.render({
                elem: '#end_time',//选择器结束时间
                type: 'datetime',
                min:"1970-1-1",//设置min默认最小值
                done: function(value,date){
                    startDate.config.max={
                        year:date.year,
                        month:date.month-1,//关键
                        date: date.date,
                        hours: 0,
                        minutes: 0,
                        seconds : 0
                    }
                }
            });
            //日期范围
            var startDate=laydate.render({
                elem: '#start_time',
                type: 'datetime',
                max:"2099-12-31",//设置一个默认最大值
                done: function(value, date){
                    endDate.config.min ={
                        year:date.year,
                        month:date.month-1, //关键
                        date: date.date,
                        hours: 0,
                        minutes: 0,
                        seconds : 0
                    };
                }
            });
    
        });
    </script>

     

    展开全文
  • 项目中常会用到时间选择器,但是找了一下layui的官方文档时间选择器是独立的存在,但是要... * @description: layui时间区间选择限值函数 * @param {start:开始时间选择器id,end:结束时间选择器id,} * @retur...
  • Layui+Springboot做时间区间查询 一、前端页面 前端是使用layui中的时间选择器 1.时间选择器 <div class="layui-inline"> <label class="layui-form-label">开始时间</label> <...
  • layui.use(['layer', 'form', 'table', 'util', 'admin','laydate'], function () { var $ = layui.jquery; var layer = layui.layer; var form = layui.form; var table = layui.table; var util = layui.util...
  • layui自定义时间框之选取周区间

    千次阅读 2018-11-29 17:45:36
    &lt;input type="text" id="date1" name="date1"...layui-input test-item" style="width:200px;" value=""/&gt; js: var max;
  • layui的日期和时间组件 - laydate

    千次阅读 2018-06-25 20:56:10
    2.时间区间 2.1效果图 2.2 实现代码 3.Uncaught TypeError: laydate.render is not a function 3.1 BUG截图 3.2 debug 4. 素材 最近在用layui开发后台,在使用layui提供的时间插件时,发现控制台报错:...
  • 30多种常用用法,一键复制代码,点击前往=>http://www.shagua.wiki/project/3?p=97 点击前往复制=>http://www.shagua.wiki/project/3?p=97 点击前往复制=>http://www.shagua.wiki/project/3?p=97 ......
  • 最终效果,点击搜索后,前端页面显示符合这个时间区间的数据。 这里讲一下大概思路: 1,前端使用layui.date 组件。 <div class="layui-inline"> <label class="layui-form-label">创建时间</...
  • 查询sql为: SELECT ...前端代码:使用的是layui时间控件 <div class="layui-form-item layui-inline"> <label class="layui-form-label">成交时间:</label> <div class="l
  • 查询条件为时间区间,实际数据为具体日期。 选择时间范围后,下面数据会筛选出范围内的数据刷新显示。 数据库表字段 JAVA实体类 private Date claimDate; // 索赔日期 因为需要接收前端两个时间(起、...
  • 用到layui框架,因此要...涉及到日期时间区间的滑动,因此要加载swiper.css swiper.js <!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8...

空空如也

空空如也

1 2
收藏数 32
精华内容 12
关键字:

layui时间区间