引入:
<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="width: 100px;">
<input type="text" class="layui-input" id="stime" >
</div>
<div class="layui-input-inline" style="width: 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();
}
});
});

layer时间插件的更多相关文章

  1. Yii笔记:打印sql、Form表单、时间插件、Mysql的 FIND_IN_SET函数使用、是否是post/ajax请求

    语句部分: yii1版本打印最后一条执行的SQL: $this->getDbConnection()->createCommand()->select()->from()-&g ...

  2. angularjs封装bootstrap官网的时间插件datetimepicker

    背景:angular与jquery类库的协作 第三方类库中,不得不提的是大名鼎鼎的jquery,现在基本上已经是国内web开发的必修工具了.它灵活的dom操作,让很多web开发人员欲罢不能.再加上已经 ...

  3. bootstrap时间插件 火狐不显示 完美解决方法

    原文链接:http://www.phpbiji.cn/article/index/id/141/cid/4.html bootstrap时间插件火狐 bootstrap-datetimepicker火 ...

  4. 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间

    原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...

  5. bootstrap-datetimepicker bootstrap-datepicker bootstrap-timepicker 时间插件

    <!DOCTYPE html><head> <title>时间插件测试</title><style type="text/css&quo ...

  6. 【Bootstrap】bootstrap-datetimepicker日期时间插件

    [bootstrap-datetimepicker] datetimepicker是一个比较方便的日期时间插件.有了这个之后,我们可以在类似于表单的地方提供一个友好的日期(时间)输入功能.官方文档:[ ...

  7. 项目中遇到angular时间插件datetinepicker汉化问题

    问题描述: 测试需要中文的时间插件: 参考资料: angularjs封装bootstrap官网的时间插件datetimepicker https://www.cnblogs.com/cynthia-w ...

  8. 时间插件--daterangepicker使用和配置详解

    1.序言: daterangepicker是Bootstrap的一个时间组件,使用很方便 用于选择日期范围的JavaScript组件. 设计用于Bootstrap CSS框架. 它最初是为了改善报表而 ...

  9. bootstrap-datetimepicker时间插件

    bootstrap-datetimepicker时间插件 依赖的jar包 bootstrap的js和css jquery.js datetimepicker的js文件: bootstrap-datet ...

随机推荐

  1. MYSQL - 外键、约束、多表查询、子查询、视图、事务

    MYSQL - 外键.约束.多表查询.子查询.视图.事务 关系 创建成绩表scores,结构如下 id 学生 科目 成绩 思考:学生列应该存什么信息呢? 答:学生列的数据不是在这里新建的,而应该从学生 ...

  2. 计数dp+概率+大数——(抽屉问题解的个数)zoj3380

    难的地方在于计数dp..给定范围[1,n]的数去填m个位置,要求不能出现超过I个相同的数, 那就用dp[i][j]表示在阶段i,已经填了j个位置的可能解法,那么只要枚举i填的位置数k∈[0,min(j ...

  3. EJB(Enterprise JavaBean)科普

    该文章是引用的,主要用于自己的学习,然后是记载免得忘记的时候到处乱找.结尾有引用地址. 到底EJB是什么?被口口相传的神神秘秘的,百度一番,总觉得没有讲清楚的,仍觉得一头雾水.百度了很久,也从网络的文 ...

  4. poj-3468-A Simple Problem with Integers-线段树入门+区间更新

    You have N integers, A1, A2, ... , AN. You need to deal with two kinds of operations. One type of op ...

  5. day 53 Django基础二之URL路由系统

    Django基础二之URL路由系统   本节目录 一 URL配置 二 正则表达式详解 三 分组命名匹配 四 命名URL(别名)和URL反向解析 五 命名空间模式 一 URL配置 Django 1.11 ...

  6. 旋转矩形碰撞检测 OBB方向包围盒算法

    在cocos2dx中进行矩形的碰撞检测时需要对旋转过的矩形做碰撞检查,由于游戏没有使用Box2D等物理引擎,所以采用了OBB(Oriented bounding box)方向包围盒算法,这个算法是基于 ...

  7. low版九九乘法表

    # while循环实现九九乘法表num_one = 1while num_one <= 9: num_two = 1 while num_two <= num_one: print(&qu ...

  8. Hive学习详细版

    一.概述 1.Hadoop的开发问题 只能用java语言开发,存在语言门槛 需要对Hadoop底层原理,api比较了解才能做开发 开发调试比较麻烦 2.什么是Hive Hive是基于Hadoop的一个 ...

  9. netty DelimiterBasedFrameDecoder

    netty server EchoServer package com.zhaowb.netty.ch5_1; import io.netty.bootstrap.ServerBootstrap; i ...

  10. [转]成为Java顶尖程序员 ,看这11本书就够了

    “学习的最好途径就是看书“,这是我自己学习并且小有了一定的积累之后的第一体会.个人认为看书有两点好处: 1.能出版出来的书一定是经过反复的思考.雕琢和审核的,因此从专业性的角度来说,一本好书的价值远超 ...