zoukankan      html  css  js  c++  java
  • layer时间插件

    引入:
            <link rel="stylesheet" href="<{$cdnsite}>/default/common/layui/css/layui.css?<{$version}>" />
        <script type="text/javascript" src="<{$cdnsite}>/default/js/jquery-1.9.1.min.js?<{$version}>1"></script>
        <script type="text/javascript" src="/default/common/layui/layui.js"></script>
    
    PHP代码:
     $searchdata = array(
                'name' => '',
                'mobile' => '',
                'timeset' => '',
                'stime' =>  date("Y-m-d",time()),
                'etime' =>  date("Y-m-d",time()),
                'status' => '',
                'city' => '',
            );
    
    
    HTML代码:
    <input type="hidden" class="layui-input" id="p_stime" value="<{$searchdata.stime}>"  name="stime" >
    <input type="hidden" class="layui-input" id="p_etime" value="<{$searchdata.etime}>"  name="etime" >
    
    
                    <div class="layui-inline">
                <label class="layui-form-label">时间选择:</label>
                <div class="layui-input-inline" id="timeset">
                    <select name="timeset" lay-filter="text1">
                        <option value="">-不限-</option>
                        <option value="today" <{if $searchdata.timeset eq 'today'}>selected
                        <{/if}>>今日</option>
                        <option value="yesterday" <{if $searchdata.timeset eq 'yesterday'}>selected
                        <{/if}>>昨天</option>
                        <option value="lastweek" <{if $searchdata.timeset eq 'lastweek'}>selected
                        <{/if}>>最近7天</option>
                        <option value="thismonth" <{if $searchdata.timeset eq 'thismonth'}>selected
                        <{/if}>>本月</option>
                        <option value="lastmonth" <{if $searchdata.timeset eq 'lastmonth'}>selected
                        <{/if}>>上月</option>
                        <option value="customize" <{if $searchdata.timeset eq 'customize'}>selected
                        <{/if}>>自定义</option>
                    </select>
                </div>
            </div>
            <div <{if $searchdata.timeset eq 'customize'}> style="display:''";<{else}>style="display:none;"<{/if}>
                 class="layui-inline" id="customtime" style="display: none;">
                <label class="layui-form-label">日期选择:</label>
                <div class="layui-input-inline" style=" 100px;">
                    <input type="text" class="layui-input" id="stime" >
                </div>
                <div class="layui-input-inline" style=" 100px;">
                    <input type="text" class="layui-input" id="etime"  >
                </div>
            </div>
    
    
    
    JS代码:
     var stime = '<{$searchdata.stime}>';
        var  etime = '<{$searchdata.etime}>';
        layui.use(['form', 'laydate'], function() {
            var form = layui.form;
    
            var laydate = layui.laydate;
            //日历格式
    
            var stime_box = laydate.render({
                elem: '#stime', //需显示日期的元素选择器
                value: stime,
                done:function(value,date){
                    $('#p_stime').val(value);
                }
            });
            //日历格式
            var etime_box = laydate.render({
                elem: '#etime', //需显示日期的元素选择器
                value: etime,
                done:function(value,date){
                    $('#p_etime').val(value);
                }
            });
    
            //select下拉
            form.on('select(text1)', function(data) {
                if(data.value == 'customize') {
                    $('#customtime').show();
                } else {
                    $('#stime').val('');
                    $('#etime').val('');
                    $('#customtime').hide();
                }
            });
        });
  • 相关阅读:
    POJ
    模板
    HDU
    CodeForces
    CodeForces
    Java
    百度之星2014复赛
    百度之星2014复赛
    转载
    百度之星2014初赛
  • 原文地址:https://www.cnblogs.com/mrszhou/p/9000890.html
Copyright © 2011-2022 走看看